W3C home > Mailing lists > Public > www-style@w3.org > January 2010

[CSS21] 9.5.2 Effect of adjacent top margin of first in-flow child on clearance

From: Bruno Fassino <fassino@gmail.com>
Date: Sat, 23 Jan 2010 22:04:19 +0100
Message-ID: <da98bce01001231304o7e5eaa8bp7279ff1f30221e2b@mail.gmail.com>
To: www-style <www-style@w3.org>
I apologize if this has already been discussed, I only found it
tangentially noted in a previous message.

At 9.5.2 the hypothetical position of an element with clear is

"determined after the top margin of the element has been collapsed
with _previous_ adjacent margins (including the top margin of the
parent block)"

This seems to exclude the effect of an adjacent top margin of the
first inflow child of the element. Such a margin cannot be considered
_previous_.  Is this reading correct?
If yes, it looks strange and not intended (such a margin affects the
position of the element's top border edge).

One may think that the above is irrelevant since it only regards the
'hypothetical position' and not the 'real' clearance computation.
But here come more difficulties. The clearance computation include
point 2 which says:

"the distance to which _these margins_ collapsed when the hypothetical
position was calculated"

so I would assume that the below listed margins are the same used for
the hypothetical position computation. But the more detailed bulleted
list does not seem compatible with the simpler mention of "top margin
of the element collapsed with _previous_ adjacent margins" of the
hypothetical position. The last two bullets list two alternatives:

- "if the block's own margins collapse together: the block's top margin".
   Here any other margin is explicitly excluded, so again an adjacent
top margin of the first inflow child is excluded.

- "if the block's own margins do not collapse together: the margins
collapsing below the clearance"
   Here it seems that an adjacent top margin of the first inflow child
should be included: it is below the clearance and may collapse with
the element top margin.

In short, point 2 adds further doubts about the inclusion or not of an
adjacent top margin of the first inflow child when deciding and
computing the clearance.

(As a side note, that whole point 2 seems currently ignored by all
browsers. Mozilla has the related bug 376365, don't know the others.
Does this situation mean that the spec are possibly going to change
here?)


Finally consider this test case (online at
http://www.brunildo.org/test/margin-collapse-clear-child-5.html) which
in my interpretation confirms that at least Firefox and Safari include
an adjacent top margin of the first inflow child when deciding the
clearance:

<div style="background: lime; border-top: 1px solid">
	<div style="float: left; height: 10px; width: 10px"></div>
	<div style="clear: left">
		<div style="margin-top: 10px"></div>
	</div>
</div>
<div style="background: yellow">next</div>

In both Firefox and Safari, the lime parent does not expand (has 0
height) and the following yellow box is 10px below its top border. I
could explain this with:
Hypothetical position is taking into account the child margin, so
there is no need for clearance and there is normal margin collapsing
(the element with clear is "outside" its parent).
If the child top margin would not be considered in the hypothetical
position determination, clearance computation would be triggered, so
even assuming that the result would be 0, one would say that the
element with clear has clearance applied, then its margin would no
more be allowed to 'escape' the bottom of the parent. This is what
happens in that browsers when there is clearance (even if the spec
reflects this only in the margin collapsing part, not in the height
definition, as has been noticed by David Baron
http://lists.w3.org/Archives/Public/www-style/2007Mar/0105.html).
Firefox and Safari are pretty consistent in this behavior, for example
with:
<div style="background: lime; border-top: 1px solid">
	<div style="float: left; height: 10px; width: 10px"></div>
	<div style="clear: left; margin-top: 10px"></div>
</div>
The parent does not expand, since no clearance computation is
triggered. Instead here:
<div style="background: lime; border-top: 1px solid">
	<div style="float: left; height: 10px; width: 10px"></div>
	<div style="margin-bottom: 5px"></div>
	<div style="clear: left; margin-top: 5px"></div>
</div>
the parent does expand, since the clearance computation is triggered,
even if the resulting clearance is zero. (Which is what Anton Prowse
called clearance paradox.)


Can someone shed some light on the determination of the 'hypothetical
position' at 9.5.2? Exactly what margins must be taken into account?
As it is now, the whole description of clearance in 9.5.2 is hard to interpret.


Best regards,
Bruno

-- 
Bruno Fassino http://www.brunildo.org/test
Received on Saturday, 23 January 2010 21:04:53 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:23 GMT