Remove white space above nav bar

Question

How do I remove the white space above this navbar that I created?

http://gyazo.com/b41271cad8d41c08c52ff26b1f1cab9e

I have search StackOveflow for this answer, but can't find one that seems to fix my issue. I have set html, body padding/margin to 0 as well as reset all other elements. Does anyone have any advice?

<nav id="header">
  <div class="home-header">
    <a href="#"><h1> testing this </h1></a>
  </div>
</nav>

Here's the CSS

#header {
  position: relative;
  margin: 0 auto 0;
  padding-top: 0px;
  background-color: $main-color;
}

Answer 1

Live demo

The space at the top is create by the h1 because of its default margin. To fix this:

#header h1{
    margin:0px;
}

PS: I assume that you removed the margin for the body tag. If not here's how you remove it:

body{
    margin:0;
}