user175084
user175084

Reputation: 4640

background-image not working

I have this in my HTML everything works except the background-image: 'images/Header.jpg'; Instead I see the grey color in the header but not the image.. I tried removing the grey color but still dont see the image...

#outerWrapper #header {
border-bottom: solid 1px #628152; 
font-size: 18px;
font-weight: bold;
line-height: 15px;
height: 115px;
background-color: Grey;
background-image: url('images/Header.jpg');

How can I make this work.. please help.. thanks

Upvotes: 5

Views: 4053

Answers (4)

Lareau
Lareau

Reputation: 2011

Have a look at your page with Firebug for Firefox. You may not be loading the image properly. You will also be able to play with the css on the fly if that's your issue.

Upvotes: 2

Arseni Mourzenko
Arseni Mourzenko

Reputation: 52331

What is the path of your CSS file and the path of the image?

You must take in account that, when using url() in CSS, the path is relative to CSS file, not to the requested page.

Imagine you have the following files:

/website/index.html
/website/templates/main.css
/website/images/header.jpg

than the CSS must be:

.style{background-image:url(../images/header.jpg);} /* Noticed "../"? */

Upvotes: 5

bAN
bAN

Reputation: 13835

Sure you need the ' char? And maybe it is case sensitive and you have a mistake in the url.. Maybe background-image:url(images/header.jpg);

Upvotes: 1

Mark Avenius
Mark Avenius

Reputation: 13947

Try changing the url to '/images/Header.jpg'

Upvotes: 2

Related Questions