title: Unwanted margin on main background image
body: <p>So i'm having trouble getting rid of a small margin that appears on the background of my main index page:  This is the <a href="https://i.stack.imgur.com/Z83Kl.png" rel="nofollow noreferrer">upper corner</a> of it, i have a fixed navbar on top that does not share the same problem, but the background image below wont fill the entire space. </p>
  
  <p>This is the css code that i'm using:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.indexmain{
      width: 100%;
      height: 1000px;
      background: url(images/main-screen.jpg) no-repeat; 
      -webkit-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
  }</code></pre>
  </div>
  </div>
  </p>
  
  <p>Apparently there's no inheritance issue from any other asset, utilizing a fixed position with 'left:0' didn't work either...</p>