Forum Moderators: not2easy
There was a very nice solution on how to center framelike content. When I followed the example I found that it works fine for increasing the size of the window in IE6, but now when the window is reduced in size.
I tried it in 1024x768, but I don't see that that should matter.
1) Did I miss the point of the example.
2) Are relative positions any use at all for placing things inside the frames (IE)?
Henrik
<div id="wrapper">
<div id="header">header</div>
<div id="predescription"><p>left</p></div>
<div id="description"><h4>Desciption</h4></div>
<div id="post-description"><p>right side</p></div>
<div id="clear-line" style="height: 0px; background: red"></div>
<div id="left"><p>left</p></div>
<div id="content"><h3>Main content</h3></div>
<div id="right"><p>right side</p></div>
<div id="footer"><p>footer</p></div>
</div>html, body {
margin: 0, padding: 0;
height: 100%;
text-align: center; /* quirky IE center */
}
#wrapper {
width: 770px;
height: 100%;
margin: 0 auto;
text-align: left;
background: #69ADB1;
}
#header, #footer {width: 100%; clear: both; }
#header {height: 150px; background: #e5ee5; }
#footer { height: 20px; background: #288A90; }
#pre-description, #description, #post-description { float:left; height: 65px; }
#pre-description { width: 385px; background: #0ff; }
#decription { width: 150px; background: #5dd8df; }
#post-description { width: 235px; background: #b8e8eb; }
#clear-line { width: 100%; height: 0px; clear: both; }
#left, #right, #content { float: left; height: 500px; }
#left {width: 160px; background: #0ff;}
#content {width: 456px; background: #5dd8df; }
#right {width: 154px; background: #b8e8eb; }
