Removing white bar from top of page

css, html

Solution

Add `margin: 0;` to `.header h1`.

Problem

I have the following code, with the html and body margins and padding set to zero, but their is still a gap at the top, why?: CSS ``` html, body { margin: 0; padding: 0; } .mobile body { overflow: hidden; } .mobile #wrapper { position: absolute; top: 0; bottom: 0; left: 0; width: 100%; } .mobile #scroller { height: 3000px; } .header { background: url(../img/dark_exa.png) repeat; height: 300px; margin: 0 auto; text-align: center; } .header h1 { color: white; } ``` HTML ``` <!doctype html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" /> <title>Mobile Parallax with Stellar.js - Demo</title> <link rel="stylesheet" type="text/css" href="css/normalize.css" /> <link rel="stylesheet" type="text/css" href="css/style.css" /> </head> <body> <div id="wrapper"> <div id="scroller"> <div class="header"> <h1>Product Title</h1> </div> </div> </div> <script src="lib/jquery.min.js" ></script> <script src="lib/jquery.stellar.min.js"></script> <script src="lib/iscroll.js"></script> <script src="script.js"></script> </body> </html> ```

Original source