css - body element moving when there is absolute positioning

Question

I have a really strange quirk happening on a site that I am building. Its a theme for concrete5 but the html is pretty site is here http://wtms.onbutton.co.uk/mm.

If you look the body has dropped by about 100px as if there is a margin. If I remove the section element, nothing is affected and the header renders fine.

Can anyone explain what's going on and how to fix it?

Answer 1

This can be solved by specifying display: inline-block for your section element.

i.e.

section {
    display: inline-block; /* new */
    position: relative;
}