CSS: Automatically Add Spaces Between Boxes

If you are a front end designer you probably know this problem: You have to add spaces between every html element like between <p> and <img> or <pre> and <figure> or whatever. It's a lot of code which can be simplified into one line:

.content > * + * {
/* perfect if your line-height is 20px */
margin-top:20px; 
}

What does it do?

It's no magic hidden here. The > means that the following stuff is only for direct childs of .content. The * means every element and the + stand for "following". So in spoken language it would be:
Every element which follows another element (so it's not the first child) whose are both childs of .content should have a space of 20px at it's top.

It's probably not the best way to do it but it works really well for me. You can see it in real life over here: http://jsfiddle.net/Stadtpirat/qQz3r/1/

http://supercode.co/s/4cc