|
Long description of float and text flow example |
|
|
| Written by Diana, on 03-09-2007 21:52 |
|
|
|
|
Long description of float and text flow example
Long description of float and text flow example
This diagram illustrates how text flows around a float, and in
particular, how line boxes of content alongside a float are shortened
to make room for the float box (including margins). The HTML source
of the example precedes the image. In the source document, a BODY
element contains a P that contains a left-floated IMG.
The top of the illustration reads "max (BODY margin, P margin)"
to indicate that vertical margins collapse. However, the IMG margin
is not involved with this calculation since the IMG is floated.
At the left side of the illustration, the left margins of BODY,
P, and IMG do not collapse (horizontal margins don't collapse).
The paragraph text flows along the right side of the IMG,
starting at the top and to the right of its right margin.
When the text reaches the bottom of the IMG bottom margin,
it continues as it would normally within a P element. Thus,
line boxes alongside a float are shortened.
Return to image.
Last update: 03-09-2007 21:52
Users' Comments (0) 
|
|
|
