Margin Collapse Example

Top and bottom margins of elements are sometimes collapsed into a single margin that is equal to the largest of the two margins.

A paragraph with a top and bottom margin of 30 pixels.

A paragraph with a top and bottom margin of 20 pixels.

The vertical margin between the two paragraphs above should be 50px (30px + 20px). But due to margin collapse, the actual margin ends up being 30px!