Полное описание примера поплавка и обтекания текста

Диаграмма иллюстрирует, как текст обтекает вокруг поплавка, и особенно - как строчные боксы содержимого рядом с поплавком укорачиваются, чтобы дать пространство для бокса поплавка (включая поля). Код HTML в примере предшествует изображению. В документе-источнике элемент BODY содержит P, который содержит всплывающий влево IMG.

Вверху иллюстрации написано "max (BODY margin, P margin)", чтобы обозначить сжатие горизонтальных полей. Однако поле IMG'а не участвует в этом расчёте, поскольку IMG всплывает.

В левой части иллюстрации левые поля элементов BODY, P и IMG не сжимаются (вертикальные поля не сжимаются).

Текст параграфа обтекает IMG справа, начиная от сверху и справа от его (IMG) правого поля. Когда текст достигает нижнего поля IMG, он продолжает выводиться нормально, как в элементе P. Таким образом, строчные боксы вдоль вертикали поплавка укорочены.

Вернуться к изображению.