Any idea why this background image isnt showing up?

[chrisidas]

Hey,

 

Here's what i have on my stylesheet

#header {
width: 1000px;
height: 112px;
background-image: url("../images/bgheader.gif");
background-repeat: repeat-x;
margin-bottom: 6px;
margin-right: auto;
margin-left: auto;
}

#header-left {
float: left;
height: 112px;
background-image: url("../images/bgheader-left.png");
background-position: left;
background-repeat: no-repeat;
}

#header-right {
float: right;
height: 112px;
padding-right: 15px;
background-image: url("../images/bgheader-right.png");
background-position: right;
background-repeat: no-repeat;
}

And here's my actual code

<div id="header">
<div id="header-right">
</div>
<div is="header-left">
  <img src="../images/logo.png" width="416" height="112" alt="Site Logo" />
  </div>
</div> 

It supposed to give the whole header like a gradient effect, then they bgheader-right and bgheader-left are supposed to give it like rounded corners. For some reason though, no matter what image i use for header-left, it doesnt show up. So i'm stuck with sharp edges on one side of my header.

 

I've moved the divs around and that didnt change anything. I had to put the header-right div before the header-left div because i couldnt get the positioning right otherwise.

 

I copied the code from the stylesheets used for my forums, and it works fine on there.

 

here's my site address so you can get some idea what it looks like now - www.fifaworldlive.com

here's my forum address so you can get some idea what it should look like - www.fifaworldlive.com/forums

 

 

Any ideas?

 

Cheers