Ecco come funziona il box model degli elementi block-leve in xhtml/css.

width = (content area width + padding left + padding right + border left width + border right width)

Ampiezza e altezza (width e height) non sono state in questo caso assegnate. Il browser dunque applica l’ampiezza e l’altezza dell’elemento in base al suo contenuto. Se non specificata, l’ampiezza di un elemento block-level è il 100%, mentre l’altezza dipende dal suo contenuto effettivo. E’ sufficiente ridimensionare la finestra per vedere come l’altezza cambi in base allo spazio disponibile e alla disposizione del testo (che è il contenuto dell’elemento).