CSS box model – more complex than rocket science

I’ve spent the day trying to better understand how the CSS box model* works. While doing so I came across this paragraph:

Vertically adjacent margins of elements in the normal document flow are collapsed. In other words, if two margins are vertically adjacent to each other, then the actual distance between the two element borders is the maximum of the adjacent margins. In the case of negative margins, the absolute maxmimum of the negative adjacent margins is subtracted from the maximum of the postive adjacent margins. The vertically adjacent margins of elements which have been floated or positioned do not collapse.

Riiiiiiiight. Got that? The next paragraph is even worse.
*(cascading style sheets – the lingua franca of web aesthetics….the box model refers to using CSS to position elements on the page)

Leave a comment