scarhand Posted October 18, 2010 Share Posted October 18, 2010 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>TITLE</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <style> body { margin: 0px; } .top { margin-bottom: 20px; background: red; } .top ul { float: right; margin: 0; padding: 0; list-style: none; } .top ul li { float: left; } .content { background: blue; } </style> </head> <body> <div class="top"> <ul> <li><a href="#">test</a></li> <li><a href="#">test</a></li> <li><a href="#">test</a></li> </ul> <div style="clear: both;"></div> </div> <div class="content"> why are you adding a top margin to the page? </div> </body> </html> For whatever reason, a top margin of 20px is being added to the top of the page above the red "top" box, even when I've set margins to 0 and only specified a bottom margin for that div. Link to comment https://forums.phpfreaks.com/topic/216188-unwanted-top-body-margin-being-added/ Share on other sites More sharing options...
scarhand Posted October 18, 2010 Author Share Posted October 18, 2010 OK so apparently if i remove the float from ".top ul li" the top margin disappears. wtf? Link to comment https://forums.phpfreaks.com/topic/216188-unwanted-top-body-margin-being-added/#findComment-1123560 Share on other sites More sharing options...
haku Posted October 19, 2010 Share Posted October 19, 2010 Get rid of the div with with the clear:both in it, and instead add overflow:auto to the containing div. This will do the same thing, and won't cause the problems you are seeing. Link to comment https://forums.phpfreaks.com/topic/216188-unwanted-top-body-margin-being-added/#findComment-1123674 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.