The OpenNET Project / Index page

[ новости /+++ | форум | теги | ]

Каталог документации / Раздел "Web мастеру, CGI, Perl, PHP, Apache" / Оглавление документа

Long description of example illustrating floating with clear

This diagram illustrates the effects of floating a box ("inner") and how its "sibling" is forced below it due to the 'clear' property.

A document window is shown, with 8 lines (numbered 1 to 8), each 24px high. Text before the "inner" box flows on lines 1 and halfway on line 2. The "inner" box has been floated to the right and occupies the second half of lines 3 and 4. The sibling box flows on the following line (line 4) and is followed by the remainder of the text.

In the following PRE element, each 24 pixel line is simulated by two lines, the second beginning with the appropriate number. Vertical bars represent the left edge of the floated box. The lines, as they appear in the image, contain:


1 Beginning of body contents. Start 

2 of outer contents.     | Inner

3                        | contents.

4 Sibling contents. End of outer 

5 contents. End of body contents.

The default text color is black. "Start of outer contents" is red. "Sibling contents" is red. "Inner contents" is blue. "End of outer contents" is red.

Return to image.


Партнёры:
PostgresPro
Inferno Solutions
Hosting by Hoster.ru
Хостинг:

Закладки на сайте
Проследить за страницей
Created 1996-2024 by Maxim Chirkov
Добавить, Поддержать, Вебмастеру