I had always this problem when a paragraph is nested inside a div. The default margins of paragraph goes upper than the div and pushes the parent div down. You can inspect the The white space between divs which caused by paragraph. I don't want to eliminate the margins of paragraph but I want the margins to place inside the parent div.
#div1{
background:#00ff00;
}
#div2{
background:#eeeeee;
}
p{
background:#ff8800;
}<div id="div1">Top div with unwanted space below</div>
<div id="div2">
<p>The margins of this paragraph pushes the parent div downward</p>
</div>
