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

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

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

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

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

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