Question

I want the body gradient to start right below where the header gradient ends.

Here is all the relevant code:

CSS:

#header
{
    position:absolute;
    top:0;
    left:0;
    background:linear-gradient(#fff,#000); 
    height:50px;
    width:100%;
}
html
{
    height:100%;
}
body
{
    background:linear-gradient(#000,#fff);
}

HTML:

<div id = header></div>

I’ve tried messing around with bottom-margin , but havn’t had any luck. Any help is appreciated.

Answer 1

You can use a container div to do it.

http://codepen.io/anon/pen/4070/1