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

Re: [CSS2.1] Clarifying 8.3.1 Collapsing Margins

From: Anton Prowse <prowse@moonhenge.net>
Date: Sun, 26 Sep 2010 11:49:18 +0200
Message-ID: <4C9F171E.5050302@moonhenge.net>
To: "www-style@w3.org" <www-style@w3.org>
CC: fantasai <fantasai.lists@inkedblade.net>
On 22/09/2010 21:34, Anton Prowse wrote:
> <div style="margin:10px 0; height:0">
>     <div style="margin:10px 0"></div>
> </div>
> the parent's margins don't collapse according to the earlier rules
> concerning adjacency since the bottom margin of the child is not
> adjacent to the bottom margin of the parent. (Specifically, in this
> situation, the child self-collapses and the resulting margin collapses
> with the parent's top margin, but this new resulting margin doesn't
> collapse with the parent's bottom margin.)

> [...] But thank goodness for that 2007 spec change of
>! If the parent's top border position were calculated by
> introducing a temporary non-zero top border instead of a temporary
> non-zero bottom border, as used to be the case, then we'd be in a rather
> strange place with the following test case:
> <div style="border-bottom:1px solid"></div>
> <div style="margin-bottom:20px">
>     <div style="margin:100px 0"></div>
> </div>
> <div style="border-bottom:1px solid"></div>
> There'd be 120px between the two solid lines, the bottom 20px
> unmistakable as the bottom (uncollapsed) margin of the parent, yet the
> position of the parent's top border would be at the top of the 120px
> space. The moral is, "artificially" preventing collapsing sets traps for
> the unwary!]

There should, of course, have been a height:0 in that last test case, as in:

<div style="border-bottom:1px solid"></div>
<div style="margin-bottom:20px; height:0">
     <div style="margin:100px 0"></div>
<div style="border-bottom:1px solid"></div>

Anton Prowse
Received on Sunday, 26 September 2010 09:50:43 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:07:50 UTC