fixing margins from navbar

Question

In my recent project, I adjust the style for this header:

<header>
  <ul>
    <li><a href="#" class="title">Loja</a></li>
  </ul>
  <ul class="right">
  <li><a href="#" class="user">username</a></li>
    <li><a href="#">logout</a></li>
  </ul>
</header>

as that:

header {
  top: 0;
  left: 0;
  background-color: #333;
  width:100%;
}

header:after{
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}

jsfiddle: https://jsfiddle.net/klebermo/ch6gtj3p/7/

but with this, I got a small space between the edge of the browser's window and the navbar. What I can do to remove this space?

you need to reset browser default settings : `body { margin: 0; }` — twxia, Jun 06 '16 at 12:33

score 2 · Accepted Answer · answered Jun 06 '16 at 12:35

2

You have to remove the default margin and padding of the <html> and <body> element:

html, body {
  margin:0;
  padding:0;
}

Working solution: https://jsfiddle.net/ch6gtj3p/8/

answered Jun 06 '16 at 12:35

Sebastian Brosch

42,106
15
72
87

fixing margins from navbar

1 Answers1