Collapsing Margins


I’d classify collapsible margins as something that might go under the radar of front end developers depending on how they were introduced to margins and padding in the first place. Personally I didn’t catch on to collapsible margins until well after I picked up CSS. In fact at first I thought it was an issue with how I was writing CSS and soon defaulted to padding for just about everything.

It turns out that collapsible margins can be one of the most useful features of your CSS. Taking advantage can lead to more stable and versatile CSS implementations across the board. This article does a nice job outlining the ‘trick’ to collapsible margins and outlines many of the ‘gotchas’ that come up when you put two elements with margins next to each other.