# Re: [css21] clearance

From: Bert Bos <bert@w3.org>
Date: Wed, 4 Feb 2009 13:36:46 +0100

Message-Id: <200902041336.46544.bert@w3.org>
```
On Tuesday 03 February 2009 11:11, Anne van Kesteren wrote:
> In http://www.w3.org/TR/CSS21/visuren.html#flow-control it states
> "... then its clearance must be set to the greater of" and then "...
> to make the sum of the following equal ..." and the one of the
> following is "the clearance itself". This seems circular. What am I
> missing?

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

The second computation is to keep the top of B2 where it is, i.e., at y
= max(M1,M2). That means:

max(M1,M2) = M1 + C2 + M2          <=>
C2 = max(M1,M2) - M1 - M2

We assumed that max(M1,M2) < M1 + H, which implies

C2 = max(M1,M2) - M1 - M2 < M1 + H - M1 - M2 = H - M2  =>
C2 < H - M2

And, as C1 = H - M2, it follows that

C2 < C1

and hence

C = max(C1,C2) = C1

(With slightly different assumptions, notably when B2 is an empty block,
C2 may be greater than C1... I think :-) )

Bert
--
Bert Bos                                ( W 3 C ) http://www.w3.org/
http://www.w3.org/people/bos                               W3C/ERCIM
bert@w3.org                             2004 Rt des Lucioles / BP 93
+33 (0)4 92 38 76 92            06902 Sophia Antipolis Cedex, France
```
Received on Wednesday, 4 February 2009 12:37:23 UTC

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:38:23 UTC