CODEWITHSUNDEEP
htmlcssdrop-down-menu
tommy5115
tommy5115

Reputation: 105

CSS Background image not works

.menubar li {
    float: left;
    width: 115px;
    text-align: center;
    background-image: url(js/left_main_bg_image.gif);
}

The background-image is not works for ie, firefox, chrome. I also got try it at table. not working also.

Can anyone help me!
I will appreciate who helped me.

Upvotes: 0

Views: 71

Answers (4)

defau1t
defau1t

Reputation: 10619

Add the height of the image to your CSS declaration too. And You don't need those <br> tags there

Something like below should work:

.menubar li {
    float: left;
    width: 115px;
    text-align: center;
    background: url('js/left_main_bg_image.gif');
     height: 100px;
}

Upvotes: 1

me_digvijay
me_digvijay

Reputation: 5502

It is expecting the li elements to be inside ol or ul tags which have class as menubar. Make sure these tags with the specified class is there.

Upvotes: 0

abhshkdz
abhshkdz

Reputation: 6365

You missed the height CSS property. See the working example.

Here is the required HTML & CSS. Compare with your code and see what you missed.

HTML

<ul class="menubar">
    <li></li>
    <li></li>
</ul>

​CSS

.menubar li {
    float: left;
    width: 115px;
    height: 115px; 
    text-align: center;
    background-image: url(js/left_main_bg_image.gif);
}​

Upvotes: 1

mr_lewjam
mr_lewjam

Reputation: 1190

.menubar li {
    float: left;
    width: 115px;
    height:100px;
    text-align: center;
    background-image: url('js/left_main_bg_image.gif');
}

notice the quotation marks around the image url...

and I have no idea why you have <br> elements in your css...

Upvotes: 0

Related Questions