CSS: collapse

First, we know that vertical margin collapse automatically. For example: 

	<div style="margin-bottom: 20px;">a</div>
	<p style="margin-top: 10px">b</p>

view raw vertical-margin-collapse.html hosted with ❤ by GitHub

(Hint: do not use inline style)
The above code will result a margin of 20px rather than 30px between div and p.

Second, we can set border-collapse: collapse; to table element, which will collapse the interleaving space of table cells. border-collapse: seperate; will do the opposite.

What if we want collapse margin even border of any two adjacent elements? Just set the according margin of the first element to a negative value. It's amazing and works good. Try it!