Why does the header need a bottom margin?

[mboehler3]

On this page here, I had to write an in-line style on the header

<div class="nav-background" style="margin-bottom:50px">

in order to move all of the content down below. If the margin-bttom was not declared, all of the content falls behind my nav menu. What is causing this to happen? Shouldn't the content just drop below the nav menu, instead of me having to declare a bottom margin? Thanks in advance, I've been trying to figure this out for a day but can't wrap my head around it.

[Fmdpa]

Certain elements on the page are positioned absolutely, which take them out of the flow of other elements. That means that just because you see the element there, it is not necessarily pushing elements below downward. nav-background is not absolute (as far as I could see), but elements above it are, which is probably why you need the margin to prevent the elements below it from sliding up too far.