On 7/24/05, ugo pozo <[EMAIL PROTECTED]> wrote: > My question is: why is it ignoring the floated div? We can see that the > content div starts in different heights in both browsers by the > background colors, but shouldn't the h2 tag respect the floated div > and appear in Firefox in the same place it appears in IE, which is > below pageHeader?
Hi, ugo, Actually, Firefox is doing it right. According to the specs[1], floats do not push other boxes around, only their contents. It only *looks* like floats push things down because the contents are moved over to make room for the floated box. Since the contents of the unfloated box make room for the floated element, the box has to grow to keep all of its contents inside. But the top of the box stays where it would be if the float didn't exist at all. Internet Explorer doesn't obey this rule, especially when you apply a dimension to the unfloated box. Instead, it pushes the unfloated box away from the floated box, giving you the appearance you see. To make Firefox do the same thing as Internet Explorer, you need to give the unfloated box the same amount of vertical margin as the space taken by the floated box. That way the box itself is moved out from under the float. Adding the top margin to IE shouldn't cause a problem, as the margin will simply slide underneath the float. The same type of thing works for boxes to the sides of a float. HTH, Michael [1] http://www.w3.org/TR/CSS21/visuren.html#floats (fourth paragraph in that section) ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
