Tok dokumentu

Výchozí chování elementů na HTML stránce je v podstatě logické a přirozené.

Tekutý obsah (fluid)

Všechny blokové elementy jsou fluidní.

Obsah se sám přizpůsobuje rozměrům prohlížeče.

Výchozí šířka je width: 100%;, proto se element roztáhne na celou šířku.

Zalamování řádků je povoleno: word-wrap: normal;

Výška je automatická: height: auto, přizpůsobuje se podle toho, kolik obsahu element má.

Obsah se řadí tak, jak je v kódu napsaný. První element v <body> je první zobrazen na stránce.

<p>První třída kašička.</p>
<p>Druhý třída myšička.</p>

První třída kašička.

Druhý třída myšička.

Elementy se řadí nad sebe.

<div>
    Rodič v pozadí
    <p>
        Jsem vnořený element
        <strong>a ještě vnořený</strong>
        element.
    </p>
</div>

Rodič v pozadí

Jsem vnořený element a ještě vnořený element.

Potomci se zobrazují nad jejich rodiči. Čím je tedy prvek víc zanořený, tím je výše.

Ne všechno by se ale takto dalo udělat, proto máme nástroje, tedy CSS vlastnosti, které tok naruší.