View Full Version : Can't get an extending header background

11-03-2010, 03:55 AM
I am trying to get the part of my header that I am using that is a solid color to extend horizontally across the top of my web page and I have followed tutorials, but something seems to be wrong with my coding as the image does not spread across the page. Thanks.

<link href="DEFAULT.css" rel="stylesheet" type="text/css" />


<div id="container">
<div id="header">
<img src="images/CampusTaps-bg_01.gif" alt="College Spot" width="1100" height="133" />

<ul id="nav">

html, body, div, span, applet, object,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strong,
dl, dt, dd, ol, ul, li,
fieldset, form, label {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
body {
line-height: 1;
ol, ul {
list-style: none;
blockquote, q {
quotes: none;
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;

/* remember to define focus styles! */
:focus {
outline: 0;

a {
text-decoration; non;

a:hover {
text-decoration: underline;


html {

#container {
width: 800px;
background: white;
margin: 3em auto

background:#333333 url(images/CampusTaps-bg_01.gif) repeat-x top;

11-03-2010, 04:11 AM
move the header div outside the container div and set width to 100%

11-03-2010, 06:32 PM
That solved the problem. Thanks