Hi all, Just wondering if you could please shed some light on this issue for me. Sorry, I dont have access to an external webserver, so I will paste the code here;
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd";> <html lang="en"> <head> <title>Float Test</title> <style type="text/css"> * {margin: 0;padding: 0;} body {font: 76% verdana, arial, sans-serif;margin: 10px;color: #000;} #header { background-color: #edd; padding: 2px; } #topnav { background-color: #d0b1b4; padding: 2px; } #leftnav { background-color: #d2d6e3; padding: 7px; width: 150px; float: left; height:150px; } #main { background-color: #ff0; margin-left: 180px; padding: 7px; min-height:500px; _height:500px; } div.z { min-height:20px; background:#ccc; margin-bottom:5px; } div.z:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } </style> </head> <body> <div id="wrap"> <div id="header"> <h1>div.header</h1> </div> <div id="leftnav"> div.leftnav </div> <div id="main"> <div class="z"> why does my generated content make me as tall as the floated leftnav to my right? </div> </div> <div id="footer"> <h3>div.footer</h3> </div> </div> </body> </html> Basic 2 col layout: leftnav div is floated left, main div has a margin a bit bigger than the width of the leftnav. If you run the code you'll see the issue. I guess the real question is "is clear:both supposed to stop clearing once it gets to the margin of the containing element, or does it also clear BEYOND that margin?". Thanks jack ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- 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/
