Question

When I insert my header background image it does not line up exactly to the top of the browser. There is a space between the header image and the top of the browser showing the background color. I want the Header to go all the way up to the top of the screen, and to not show any background color.

   /* CSS Document */

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

body {
       font: 12px/16px Verdana, Geneva, sans-serif;
       color: #000;
       background-color:#426fac;

}

/*** header
****************************************/
#header {
    background: url(images/header-bg.png) no-repeat center top;
    overflow: hidden;
}

ANy ideas on how to do this?

Answer 1

You may want to define whatever element your header is (h1/div/?) has having 0 margin also — many elements have margin built in, and that may be causing the space you’re seeing, as #header is obviously attached to something