There is a gap at the top of my webpage

Question

here is a JS Fiddle
I have already tried a couple of different things such as body { margin:0; padding:0;} it doesn't work

body {
margin: 0;
width: 100%;
height: 3000px;
}

can you help me to understand why you giving `max-width` and `height` in `body` element? — Kheema Pandey, Mar 27 '15 at 04:53

score 0 · Accepted Answer · answered Mar 27 '15 at 04:25

0

Look at the header margin:

#header {
    width: 100%;
    /*margin: 20px 0;*/
    z-index: 1;
}

The space comes from this. Delete it.

answered Mar 27 '15 at 04:25

Will Reese

score 0 · Answer 2 · edited May 23 '17 at 12:33

0

this is called Margin Collapsing.. try replacing this..

#header {
    width: 100%;
    z-index: 1;
}

edited May 23 '17 at 12:33

Community

answered Mar 27 '15 at 04:27

Sarath

score 0 · Answer 3 · answered Mar 27 '15 at 05:10

0

Add reset.css file to your webpage. ask google for reset.css

answered Mar 27 '15 at 05:10

Ramu

score 0 · Answer 4 · answered Mar 27 '15 at 13:12

0

 margin: 0px 20px 0 20px; or margin-top:-10px;

try this

answered Mar 27 '15 at 13:12

Uraj

4 Answers4