First of all, margin organization is headache for html coders sometimes.
When I code html+css, my goal is always “creating modules like LEGO.” 
It is very helpful when you code a huge number of pages.
In this process, margin organization is an important factor. 

Need uppermargin? bottommargin?
OK I know, I put top margin for this… and bottom margin for this…
If you code html+css like this, margin organization always fails. Margin rules get complicated and it becomes impossible to handle.

“All modules need to have same margin rule.” I think.
In my opinion, “All modules should have (mostly) same BOTTOM-MARGIN.”
This makes things get simple.
And, this let you make huge pages easily like putting modules like LEGO.
Never put margin-top for common modules.
It always make things complicated.

But, what should I do when I want upper margin for the module?
I want it because I need *break* of my page.

<style>
.module{ margin:0 0 20px; } /* same bottom padding for each modules */
.getUpperMargin{ padding-top:10px; } /* I need upper margin for this! */
</style>

<!--
    hehe This is what I wanted, woot.
-->
<div class="module">blah blah blah</div>
<div class="module getUpperMargin">blah blah blah</div>
<div class="module">blah blah blah</div>
<div class="module getUpperMargin">blah blah blah</div>

I hate this ;(
because this code is pretty complicated.

Adding “getUpperMargin” is simple, isn’t it?
No. because it becomes *another* module if you add extra class.
Simplicity was lost.

Followings are much more simple than above hah?

<style>
.module{ margin:0 0 20px; } /* same bottom padding for each modules */
.spacer{ height:10px; } /* let me use spacer, baby */
</style>

<div class="module">blah blah blah</div>
<div class="spacer"></div>
<div class="module">blah blah blah</div>
<div class="module">blah blah blah</div>
<div class="spacer"></div>
<div class="module">blah blah blah</div>

I know what you wannna say.
“Hey I hate such a crappy div. It’s not semantic!”
I agree with it, it’s true.

But, accordiong to my experience, This pattern makes things less troubled.
This looks ugly but is extremely simple.
Other people without you can 100% understand what this code means.

In the same reason, I don’t like wrapping modules with div like div.mySection and adding padding to it. It let html code deeply nested and make it hard to understand. adding spacer is much more simple. Simplicity makes your code less fragile.

This is just my opinion.
Give up about sematics a little if you want to make pages like LEGO.
Complicated code makes everyone unhappy.
Whom does it make happy? haha.