Problem with the header and the nav bar.

[sweetgirl7808]

SOLVED!!! Thanks a lot! :o)

I have made a new layout a few days ago. Now I have a problem with the header.
This is how the layout should look like:

SPN-BLACK-WHITE-LAYOUT

But when I use a the nav-bar it looks like this: HERE
How can I fix that? I want the header go along with the background.



Here is the code:

body, p    {
        background-image:url(http://i729.photobucket.com/albums/ww294/shelly7808/background1a.jpg);
        background-repeat: repeat-x;
        background-attachment: scroll;
        background-position: top;
        background-color: #F1F1F1;
        text-align: center;
        color: #6F6F6F;
        font-family: "Lucida Sans Unicode",tahoma,verdana,sans-serif;
        font-size: 11px;
        margin: 0;
        }
    td {
        margin-left: auto;
        margin-right: auto;
        }
    a, a:link, a:visited {
        color: #0b4157;
        text-decoration: none;
        }
    a:hover {
        color: #5b95b3;
        text-decoration: none;
        background-color: #eeeeee;
        }
    code, kbd, pre, tt {
      font-family: monospace;
        }
    h3 {
        background-color: #eeeeee;
        color: #6F6F6F;
        font-size: 12px;
        font-weight: normal;
        text-transform: uppercase;
        letter-spacing: 2px;
        list-style: none;
        margin: 10px 0 10px 0;
        padding: 3px;
        }

/*---------------------------------------------------------------------
   General page alignment and width
------------------------------------------------------------------------*/

#content {
        width: 900px;
        margin: 0 auto;
        margin-top: 0px;
        background-color: #f1f1f1;
        border: 2 solid #f1f1f1;
        padding: 0;
        }

#maincontent {
        margin-top: 15px;
        margin-left: 290px;
        background-color: transparent;
        }

#sidebar {
        padding: 15px 0 0 0;
        margin-top: -15px;
                margin-left: 40px;
        background-color: transparent;
        border: 0 solid #E9E9E9;
        width: 230px;
        float: left;
        text-align: justify;
        }

/*-----------------------------------------------------------------------------
   Header - you can add a header image with either #header or .headerimage
--------------------------------------------------------------------------------*/

#header {
        /* for formatting header image */
        }

.headerimage {
        background-image: url(http://i46.photobucket.com/albums/f105/SweetGirl7808/header/spn_black.gif);
        background-repeat: no-repeat;
        background-attachment: scroll;
        background-position: center;
        height: 300px;
        width: 900px;
        margin: 0 auto;
        text-align: center;
        }

/*look  and color of links (also partly for footer)*/
    div#header a, div#header a:link, div#header a:visited, div#footer a, div#footer a:link, div#footer a:visited {
        padding: 5px;
        margin-bottom: 70px;
        color: #5b95b3;
        font-weight: normal;
        font-size: 10px;
        letter-spacing: 2px;
        text-align: center;
        text-transform: uppercase;
        text-decoration: none;
        background-color: transparent;
        }
    .view {
        padding: 5px;
        margin-bottom: 70px;
        color: #626262;
        font-weight: normal;
        font-size: 10px;
        letter-spacing: 2px;
        text-transform: uppercase;
        text-decoration: none;
        }
    div#header a:hover, div#footer a:hover {
        color: #5b95b3;
        background-color: transparent;
        }

Any help would be very appreciated!!