html element has horrible margin-top

[Ollie_w]

I have recreated my problem on code pen.

http://codepen.io/OllieW/pen/EKOKJz

I want a full height div. it is set to height: 100vh This is working for the height of the div as expected.
body and html are set to min-height: 100% and margin: 0 yet there is a margin at the top of the page.
Please help!

[Ollie_w]

For some reason if I give the div a border, the space at the top goes away. Not sure why this should be the case?

[Paulie_D]

Collapsing margins.

The defualt margin of the heading is the issue…setting a border on the div gives the heading margin to push against.

http://stackoverflow.com/questions/9519841/why-does-this-css-margin-top-style-not-work

This is why we normally use a CSS reset.

[Author]

Posts