RE: [CSS21] Collapsing Margins

Apparently we would benefit from a third opinion here.

For the concept of min-height, I don't think there is a precedent so far where setting min-height would make something smaller than it would be without it (which is what this test suggests)...

-----Original Message-----
From: www-style-request@w3.org [mailto:www-style-request@w3.org] On Behalf Of Boris Zbarsky
Sent: Wednesday, September 10, 2008 7:30 AM
To: Alex Mogilevsky
Cc: Arron Eicholz; www-style
Subject: Re: [CSS21] Collapsing Margins


Alex Mogilevsky wrote:
> In 10.7, if "tentative height" is not smaller than "min-height", then the third bullet doesn't apply.

This is true.

> There are two possible values for "tentative height" of "outer"
> 1) 20px - if bottom margin of "inner" collapses with "outer"
> 2) 100px - if bottom margin of "inner" doesn't collapse with "outer"

Right.

As I see it, the process is the following:

1)  Calculate the used height ignoring min-height and max-height, using
     section 10.6.3.  At this point the margins are treated as
     collapsing, since there is no indication they shouldn't be.
2)  If the result is less than min-height, then per 10.7 item 3 set
     computed height to min-height and recalculate.  At this point the
     height doesn't depend on the kids at all, so whether margins
     collapse is irrelevant for the height computation.
3)  Decide whether margins collapse.  This doesn't affect the height of
     the parent, which is already decided, but DOES affect the margins of
     the parent.  For example:

       Text
       <div style="margin-bottom: 10px">
         <div style="height: 20px; margin-bottom: 20px"></div>
       </div>
       More text

     Should have 40px of space between the "Text" and the "More text"
     while:

       Text
       <div style="margin-bottom: 10px; min-height: 21px">
         <div style="height: 20px; margin-bottom: 20px"></div>
       </div>
       More text

     Should have 31px of space between the "Text" and the "More text".

> * If min-height were not set, the height of "inner" and "outer" were 20px.

Agreed.

> * Since 20px is less than the value of min-height, bottom margin of "inner" doesn't collapse with "outer"

Yes, and at the same time per 10.7 the computed height of outer is set
to the min-height.

> * According to 10.6.3, "if the bottom margin of the block does not collapse with the bottom margin of its last in-flow child,

This part of 10.6.3 doesn't apply, since "height" is not auto by this point.

> The result of 100px satisfies all restrictions, including content height and min-height

But violates 10.7 item 3.

> The result of 21px ignores the 80px margin, which is in conflict with 10.6.3

Not at all, since the relevant part of 10.6.3 only applies when height
is auto and when the 10.6.3 computation for auto height gives a value
between min-height and max-height.  As soon as it doesn't, the used
height is just given by the height, min-height, or max-height, whichever
is relevant, independently of what the child heights are.

-Boris

Received on Wednesday, 10 September 2008 16:58:45 UTC