Background image of Anchor not working with Safari/Firefox

Question

Hi,

I have following Css where i have used back-ground image. Then i am generating Anchor and assigning css class which has image. It works fine with IE but does not work with Safari,Firefox and Chrome.

Can anyone help me on how to fix it. I have given details below.

Thanks, Chandan

Css

.HOME { BACKGROUND-IMAGE: url(../images/home.jpg); WIDTH: 56px; BACKGROUND-REPEAT: no-repeat; HEIGHT: 20px } .HOME A { WIDTH: 56px; HEIGHT: 20px } .HOME A:hover { BACKGROUND-IMAGE: url(../images/home1.jpg); WIDTH: 56px; HEIGHT: 20px }

Html Code

Answer 1

It would work if you would use the following CSS:

a.home { background-image:url(../images/home.jpg); width:56px; background-repeat:no-repeat; height:20px }
a.home:hover { background-image:url(../images/home1.jpg); width:56px; height:20px }

Answer 2

background-image is getting be deprecated, I suggest to use:

a.home { background: url(../images/home.jpg) no-repeat; width:56px; height:20px }
a.home:hover { background: url(../images/home1.jpg); width:56px; height:20px }