I'm having a float drop problem in Safari (2.0.3, Panther) but not in Internet Explorer for Mac or Windows.
I've got a basic two column layout with the menu div #leftcol floated left and a content div to the right. See http://design.open.ac.uk/ What I want to do is put a search box underneath the left menu, so I've created a search_box div, which also floats left. This all seems to work fine. See http://design.open.ac.uk/search_box_test.htm The problem comes in Safari (2.0.3, Panther) when I use the .left class in the main content div on content above the new search box. The .left styled image in the page above is pushed down so that the top is level with the top of the search box. The text still flows around it as a normal float left. This only seems to happen in Safari... anyone got any ideas at a solution? Cheers, Peter. The relevant CSS code is: #leftcol{ float: left; width: 175px; padding: 0; background-color:#FFFFFF; margin-top: 11px; margin-bottom: 11px; margin-left: 7px; border: 1px solid #D1D1A5; display: inline; } #search_box{ float: left; width: 175px; padding: 0px 0px 4px 0px; background-color: #FFFFCC; margin-top: 2px; margin-bottom: 11px; margin-left: 7px; border: 1px solid #D1D1A5; clear: left; display: inline; } .left{ float: left; margin-right: 10px; margin-top: 4px; margin-bottom: 4px; } ______________________________________________________________________ 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/
