CSS margin collapse

The margin collapse happens when the top and bottom values collide, like in the example, where the <h1> element has a bottom margin of 80px and the <h2> element has a top margin of 40px. Due to the margin collapse, the final value is equal to the largest of the two margins (or just one of them, if they are equal), 80px, instead of summing up values into a total of 120px margin.