HTML white space

Question

i am new to css & html and i have this problem where when i make a website there is some white space on top even if padding = 0 take a look on my html

header {
  margin: 0;
  padding: 0;
  background: #0e83cd;
}
nav ul {
  display: block;
  list-style: none;
}
nav ul li {
  display: inline;
}
nav ul li a {
  display: inline;
}

  <body>
    <header>
      <nav>
        <ul>
          <li><a href="">Num1</a></li>
          <li><a href="">Num2</a></li>
        </ul>
      </nav>
    </header>
  </body>

EDIT dwreck08, Aziz Solved my problem by adding padding 0 and margin 0 to html , body THANKS

I'm sure this is a duplicate but I can't find it. tl;dr - `
` has inherent `margin-top` and `margin-bottom` of `16px`. Remove that manually. — TylerH, Sep 17 '15 at 19:56
possible duplicate of [Why
adds extra top margin?](http://stackoverflow.com/questions/27618000/why-ul-adds-extra-top-margin) — TylerH, Sep 17 '15 at 20:00

score 1 · Accepted Answer · answered Sep 17 '15 at 19:55

1

Apply:

html, body { padding: 0; margin: 0;} and nav ul {margin: 0;}

JS Fiddle

answered Sep 17 '15 at 19:55

Derek Story

9,518
1
24
34

score 0 · Answer 2 · answered Sep 17 '15 at 19:55

0

This is caused by the default browser styling, try this:

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

answered Sep 17 '15 at 19:55

Aziz

7,685
3
31
54

score 0 · Answer 3 · answered Sep 17 '15 at 20:07

0

You must reset the browser native css: try to link this stylesheet.

Link: https://rawgit.com/jasonkarns/css-reset/master/reset.css

Fiddle: http://jsfiddle.net/tgr8kkn8/2/

answered Sep 17 '15 at 20:07

Naramsim

8,059
6
35
43

HTML white space

3 Answers3