css

Page 142

Visual formatting model

5.

6.

7.

8. 9.

ing block [p. 122] . When the float occurs between two collapsing margins, the float is positioned as if it had an otherwise empty anonymous block parent [p. 123] taking part in the flow. The position of such a parent is defined by the rules [p. 111] in the section on margin collapsing. The outer top [p. 106] of a floating box may not be higher than the outer top of any block [p. 123] or floated [p. 136] box generated by an element earlier in the source document. The outer top [p. 106] of an element’s floating box may not be higher than the top of any line-box [p. 133] containing a box generated by an element earlier in the source document. A left-floating box that has another left-floating box to its left may not have its right outer edge to the right of its containing block’s right edge. (Loosely: a left float may not stick out at the right edge, unless it is already as far to the left as possible.) An analogous rule holds for right-floating elements. A floating box must be placed as high as possible. A left-floating box must be put as far to the left as possible, a right-floating box as far to the right as possible. A higher position is preferred over one that is further to the left/right.

References to other elements in these rules refer only to other elements in the same block formatting context [p. 132] as the float. Example(s): This HTML fragment results in the b floating to the right. <P>a<SPAN style="float: right">b</SPAN></P>

If the P element’s width is enough, the a and the b will be side by side. It might look like this:

9.5.2 Controlling flow next to floats: the ’clear’ property ’clear’ Value: Initial: Applies to: Inherited: Percentages: Media: Computed value:

142

none | left | right | both | inherit none block-level elements no N/A visual as specified

4 Sep 2009 15:30


Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.