Wasteland Wasteland - 1 month ago 12
CSS Question

Remove gap at the top of the page

How can I get rid of the gap between the top of the page and the blue div? Please note that bootstrap is loaded.



html,
body {
margin: 0;
padding: 0;
background: #444;
}
#root {
margin: 0 auto;
width: 960px;
background-color: blue;
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<div id='root'>
<h1>Header Header</h1>
</div>





http://codepen.io/wasteland/pen/qqOddN

Thank you

Answer

You need to specify margin: 0 on the h1.

revised codepen

Basically, you need to override the top margin applied to the h1 from three different sources:

enter image description here