Help with div background image

Darkmatter5 · 11-26-2008, 04:00 PM

Here's my CSS code

Code:

#header {
    height: 60px;
    border-bottom: 2px solid black;
    background-image: url(images/hdr-bkg.png);
    background-repeat: repeat-x;
    /*background-color: fuchsia;*/
    z-index: 2;
}

In my HTML file I've created the header div, but the image won't show up in FF or IE. The path to the file is correct, what could be causing this?

Excavator · 11-26-2008, 04:17 PM

Hello Darkmatter5,
Try replacing all those background lines with this:

Code:

background: #000000 url(images/hdr-bkg.png) repeat-x;

Change the #000000 color or remove it, it's only black because I don't know what fucia is.

BoldUlysses · 11-26-2008, 04:18 PM

Where is your CSS file located relative to the image file, though? If you're linking to an external stylesheet from your HTML file like so:

Code:

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

then your CSS file is up one directory level (/css) relative to the HTML file, so in referencing the background image, you'll need to tell the CSS file to go back down one level:

Code:

background-image: url("../images/hdr-bkg.png");

If that doesn't fix it post your whole code (HTML and CSS).

Darkmatter5 · 11-26-2008, 04:51 PM

Both suggestions helped the ../ post fixed the image not showing, but the other post helped consolidate my code. Thanks!!