Transparent Header Not Showing

HTML & CSS
1

Hi,

I’ve done this about 1000 times before but for some reason this one is causing me some grief. I’m trying to put a transparent logo on to my sites background for a header but for some reason there is a white box appearing there instead of my logo.

Here is the link http://www.clhdesigns.com/pr

And the CSS associated with it

#header {
	background:url(../images/header.png) no-repeat ;
	margin: 0;
	height:85px;
	width:960px;
}

Any ideas?

2

Hi,

I’m a little confused :slight_smile:

This is the image you have in the background of your header.

http://www.clhdesigns.com/pr/images/header.png

It’s just a transparent image which means that the background will just be white from the colour underneath.

I didn’t see a logo anywhere.

Am I looking at the wrong thing?

3

Hi Paul,

that;s the problem. I do not want the white background on my header. The logo itself is white I want it to blend in with the sites background.

4

Hi,

You’ll have to move the header outside of your wrapper as you can’t actually rub out a background by placing another element on top.

Or you could just match the background colour of the body in the header to create that illusion.


#header {
    background:[B]#D7E1E2[/B] url("../images/header.png") no-repeat;
    height: 85px;
    margin: 0;
    width: 960px;


}

Is that what you meant?
(although you cpuld stick another color on top)