Sent by Michael Ryznar on 12 July 2004 21:09
Philippe Wittenbergh wrote:
> vertical margins never collapse between floated blocks,
Very true.
> or between a floated block and a non floated block.
<http://www.w3.org/TR/CSS21/box.html#collapsing-margins>
CSS21: "Vertical margins between a floated box and any other box do not
collapse"
This is the statement that is a little unclear still. Its very funny
that the specs actually say this because in all my test cases [1] - as
well as in Philippe's test case (especially Philippe's test #4 [2] ) it
is very clear that vertical margins *do* collapse between a floated
block and a non-floated block.
Yes, the margin of the floated box does not collapse but the margin of
the non-floated block box *does* collapse when placed just after the
floated box and so one should be correct in saying that "margins
collapse between a floated block and a non floated block." But the specs
read the opposite.
Either I am misunderstanding this, or else all the browsers are
incorrect. I am sure it is the former and so I would like to know if
someone could enlighten me on this
And I should summarize the other important parts of this thread which
seem to be conclusive:
Very important: Yes, I do believe Philippe is correct when he indicates
my Mozilla 1.3.1 mac browser is displaying a bug in its behaviour of not
considering a non-breaking space ( ) to be "content" when used in a
clearing div and therefore the unwanted margin collapse occurs. Thanks
for clarifying this Philippe. And so for the sake of Moz 1.3.1 one could
put a full word in the clearing div to make it function - or else use
one of the better solutions described below. (And yes, the behaviour of
Moz 1.3.1 to act differently with certain letters when used in clearing
elements must also be a Moz bug.)
Ingo's suggestion of specifying a font-size: 2px; instead of 1px; on the
clearing element works well. Thank you Ingo.
Fred and Steve's suggestion to specify a border on the clearing element
to prevent the margin wrap also works well. Thank you Fred and Steve.
Brunos suggestion to use a margin-bottom on the preceeding float
(instead of a margin-top on the following non-floated block element
works well too. That was a simple and obvious solution that I just
hadn't thought of I think that is the solution I am going to use. Thanks
Bruno.
[1]
http://www.ryznardesign.com/web_coding/tests/2004/preventing_margin_collapse.html
[2] <http://dev.l-c-n.com/_temp/collapsing_margins2.php>
Thanks for this helpful test page Philippe!
--
Mike Ryznar
Ryznar Design
Burnaby, British Columbia
Canada
http://www.ryznardesign.com
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
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/
