W3C home > Mailing lists > Public > www-style@w3.org > March 2009

[CSS21] Clearance paradox

From: Anton Prowse <prowse@moonhenge.net>
Date: Sun, 22 Mar 2009 19:56:28 +0100
Message-ID: <49C689DC.608@moonhenge.net>
To: "www-style@w3.org" <www-style@w3.org>
Hi,

I think CSS2.1 contains a paradox as regards clearance.

Recently on this list,[1] Bert Bos provided the following demonstration
of clearance calculations.  He wrote:

----
Assume (for the sake of simplicity), that we have just three boxes, in
this order: block B1 with a bottom margin of M1 (B1 has no children and
no padding or border), floating block F with a height H, and block B2
with a top margin of M2 (no padding or border, no children). We also
assume B2 is not empty.

Without considering the 'clear' property on B2, we have the situation in
the diagram below. The margins of B1 and B2 collapse. Let's say the
bottom border edge of B1 is at y = 0, then the top of F is at y = M1,
the top border edge of B2 is at y = max(M1,M2), and the bottom of F is
at y = M1 + H.

     |               |                     |
     |               | B1                  |
     |_ 0            |_____________________|
     |
     |_ M1            _______
     |               |       |
     |_ max(M1,M2)   | F     | ____________
     |               |       |             |
     |_ M1+H         |_______|             |
     |                                     |
     |               | B2                  |
     |               |                     |

We also assume that B2 is not below F, i.e., we are in the situation
described in the spec where we need to add clearance. That means:

     max(M1,M2) < M1 + H

The spec says that we need to compute clearance C twice, C1 and C2, and
keep the greater of the two: C = max(C1,C2). The first way is to put
the top of B2 flush with the bottom of F, i.e., at y = M1 + H. That
means, because the margins no longer collapse with a clearance between
them:

     bottom of F = top border edge of B2  <=>
          M1 + H = M1 + C1 + M2           <=>
              C1 = M1 + H - M1 - M2
                 = H - M2
----


But there is an assumption being made here that margin collapsing is
prevented, in other words, that C1 is non-zero or equivalently that
H != M2.

When H = M2 (which happens to be what the diagram actually shows!) we
have a problem:  if clearance is zero then margins collapse and so
clearance is non-zero; but if clearance is non-zero then margins don't
collapse and the clearance needed is zero.

The interaction between clearance and margin collapsing requires several
irksome special cases, and leads to strange ideas such as negative
clearance.  I would be really grateful if someone could explain why the
change was made[2] from clearance implemented as a change in margin
value to clearance implemented as an addition of spacing.  I'm sure
there must be tricky edge-cases which expose problems with the original
implementation, but it's hard to evaluate the strength of the new
implementation without knowing what these edge cases are.

[1] http://lists.w3.org/Archives/Public/www-style/2009Feb/0108.html
[2] http://dbaron.org/log/2007-03#e20070329a

Cheers,
Anton Prowse
http://dev.moonhenge.net
Received on Sunday, 22 March 2009 18:57:24 GMT

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