Content appearing behind fixed header

Question

I fixed the header section of a website, but the first div of the page appears behind the header; instead of starting from the end of the header.

Answer 1

When you apply position: fixed or position: absolute the element is being removed from the document flow, so the elements that come after treat it as a non-existent. That's why your div jumps up. To fix that apply a margin-top that equals to your header height - http://jsfiddle.net/2xjES/