Thank you for your answer, Michael, it helped me a lot.

Although the solution you provided did not quite work (adding top margin to h2 strangely 
pushed all divs down, both in FF and IE), I have figured out a solution myself based on 
the mechanicals of float you explained. It's not very elegant since it involves changing 
the XHTML code; however, the logical structure of the content itself is unaffected; only 
the "design specific" div was changed.

This is what worked for me: putting the extraDiv1 div *inside* the leftcontent 
div and above any content it might contain. Then, I floated the h2 element left 
and also cleared it left. The page displays perfectly both in IE and FF now.

Thanks again, and, if anyone can think of a more elegant solution, I'm all ears.

--
~ ugo pozo ` [EMAIL PROTECTED]
~ icq, msn ` 61410828, [EMAIL PROTECTED]
~ aim, irc ` ugopozo, [EMAIL PROTECTED]


Michael Landis wrote:
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/

Reply via email to