Hi all,
I came across a simple layout tutorial @
http://www.vanseodesign.com/blog/css...mn-css-layout/ which I found very useful and started to play with the code. I'm have altered it to whats below and have a margin/padding issue between the content-wrap and main divs left side in IE7 and not in FF3. Would really like to know whats going on and a
W3C valid fix if there is! If anyone has other browsers and it's showing differently I'd like to know as well.
Thanks
Denis
- Code: Select all
<html>
<head>
<title>2 Column CSS Layout</title>
<style type="text/css">
div {
text-align:center;
}
div#wrap {
border: 1px solid purple;
width: 800px;
margin: 0 auto;
padding: 5px;
text-align: left;
}
div#header {
border: 1px solid red;
width: 100%;
height: 300px;
}
div#content-wrap {
border: 1px solid black;
width: 800px;
}
div#main {
border: 1px solid blue;
width: 60%;
min-height: 500px;
_height: 500px;
margin: 5px;
}
div#sidebar {
float: right;
border: 1px solid green;
width: 35%;
height: 350px;
margin: 5px;
}
div#footer {
border: 1px solid red;
width: 100%;
height: 30px;
}
</style>
</head>
<body>
<div id="wrap">
<div id="header">
</div>
<div id="content-wrap">
<div id="sidebar"></div>
<div id="main"></div>
</div>
<div id="footer">
</div>
</div>
</body>
</html>
Padding/Margin unknown source
Jul 14th, 2008, 09:16
Similar Threads
