> From: Mark Wheeler > > I have a little problem I can't seem to figure out. Below is > a sample code of some floated divs. It all is as I would like > it, except the div that contains "MORE TEXT GOESE HERE...". I > want that to clear the previously floated divs that contain > dates and prices, not the red bordered div. This way, the div > containing "MORE TEXT GOES HERE..." > will end up underneath the previous four floated divs. I put > that section in a div by itself, thinking that clearing the > final float would only clear within the containing div, but > it's not doing that. > It seems to work fine in IE/Win, but not in Firefox or > Safari. Any help would be appreciated. Here's the sample code. > > ...
Before anybody says "You'll get more replies if you post a URL," I did that for you: http://mg.to/test/float.html When I load the page in IE, the "MORE TEXT GOES HERE" is below the red box, just like in Firefox. I ran into what looks like the same problem this morning. On the right side of this page is a calendar widget and event list: http://blog.zvents.com/ The event list contains two events, and in Firefox the second event is way down by the bottom of the page. This is caused by the ".ZventsEventSeparator { clear: both; }" rule in zvents.calendar.css - if I take that out the event list displays as expected. It's also OK if I change it to clear:right. It looks fine in IE with or without the clear. I added that clear to deal with floated images in this version of the event list: http://www.zvents.com/widgets/calendar/2/zvents-calendar-fancy.html Without the clear, the images don't line up. clear:right works here as well, but I did the clear:both because people using this widget might float the images left instead of right. I guess I am fairly confused about floats and clears, and especially how I can use them in an embeddable widget without interfering with (or being affected by) other layout on the page. Is there a reference that anyone can recommend that would help explain this kind of problem? Many thanks, -Mike ______________________________________________________________________ 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/
