Příklad obtékání dvou objektů vedle sebe

Text vlevo je uveden dříve. Nikdy ale nepodteče pod ten pravý sloupeček.
Text jakoby v pravém sloupečku je ve stejné výšce jako levý text.

Nějaký prvek s clear: both.

Zdroják:

<div style="float: left; width: 70%">
Text vlevo je uveden dříve. Nikdy ale nepodteče pod ten pravý sloupeček.
</div>
<div style="float: right; width: 26%">
Text jakoby v pravém sloupečku je ve stejné výšce jako levý text.
</div>
<p style="clear: both">Nějaký prvek s clear: both</p>

Všimněte si, že součet šířek je méně než 100%. Je to trik, který rád používám -- kdybych dal 100%, tak se při nastavení rámečků (nebo občas při zvětšování písma) ve standardním módu rozpadne design. Raději tam nechávám určitou vůli, abych na to později nemusel moc myslet.

Pomocí dvou obtékaných divů se v současnosti dělá nejvíce moderních layoutů.

Příklad se vztahuje k textu o obtékání a k css vlastnosti float.