Adding a background that has no top on side margin in css
<p>When adding my background image using CSS, I find that there appears to be a <code>margin</code> at the top and sides. </p>

<p>I tried adding <code>padding: 0; margin: 0;</code> and <code>left: 0px; top: 0px;</code> but this has not fixed the problem.</p>

<p>Here is my html</p>

<p><div class="snippet" data-lang="js" data-hide="false">
<div class="snippet-code">
<pre class="snippet-code-css lang-css prettyprint-override"><code>#header {
  background: url(logo.png) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  padding: 0;
  margin: 0;
  background-size: cover;
  left: 0px;
  top: 0px;
}</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div id="header"&gt;
  &lt;h1&gt;Hello World!&lt;/h1&gt;
  &lt;p&gt;The background-image is fixed. Try to scroll down the page.&lt;/p&gt;
  &lt;p&gt;The background-image is fixed. Try to scroll down the page.&lt;/p&gt;
  &lt;p&gt;The background-image is fixed. Try to scroll down the page.&lt;/p&gt;
  &lt;p&gt;The background-image is fixed. Try to scroll down the page.&lt;/p&gt;

&lt;/div&gt;</code></pre>
</div>
</div>
</p>