I have the following code on a site, it displays properly in Firefox and
IE7, but in IE6 it doesn't display the main content where it should be, it
displays it in position left-to-right properly, but it displays
top-to-bottom once the sidebar ends.
CSS:
* {
margin: 0;
padding: 0;
}
a img {
border: none;
}
body {
background: #eee url("i/bg-page.gif") repeat-x top;
color: #999;
font-size: 0.75em;
line-height: 150%;
font-family: arial, helvetica, sans-serif;
margin: 0;
margin-top: 15px;
}
div#wrapper {
width: 920px;
margin: auto;
}
div#header {
background: #000;
padding: 0;
color: #999;
text-align: center;
font-size: 13px;
width:700px;
}
div#sidebar {
width: 200px;
margin-left: 20px;
float: right;
color: #777;
background: #ccc;
}
#content1 {
background: url("i/content-top.png") no-repeat;
width:700px;
margin:0;
padding: 16px 0 16px;
}
#content2 {
background:url("i/content-bottom.png") no-repeat bottom;
padding:0 0 16px;
}
#content3 {
background:url("i/content-middle.png") repeat-y;
padding: 0 15px 0 15px;
color: #666666;
text-align:left;
font-size: 13px;
}
HTML:
<div id="wrapper">
<div id="header"></div>
<div style="clear: both"></div>
<div id="sidebar">
<h2>About</h2>
This is about us...
<div style="clear: right;"></div>
</div>
<div id="content1"><div id="content2">
<div id="content3">
<h2>Welcome</h2>
Welcome to my site this is where the copyright goes!
</div></div></div>
<div id="footer"></div>
</div>
You can see it live at www.getherdnews.com/test.html
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
