Jens Sterckx
Jens Sterckx

Reputation: 87

css background-position cross browser

I'm using a sprite image containing several buttons with their state. background-position is working in Chrome and Edge but not in Firefox!

Fiddle: (If you run this in Chrome/edge it works, but not in firefox) https://jsfiddle.net/bkgrnnmu/1/

The layout of the sprite image:

         buttons
         _ _ _ _ _ 
Normal: |_|_|_|_|_|
Hover:  |_|_|_|_|_|
Click:  |_|_|_|_|_|
Dis:    |_|_|_|_|_|

I also noticed that

background-position-x
background-position-y

is rarely used css, is there any other way to solve this?

Upvotes: 0

Views: 535

Answers (1)

Vcasso
Vcasso

Reputation: 1348

Firefox doesn't support background-position-x or background-position-y. Try background-position: 0 0; first condition is x, second y.

Upvotes: 1

Related Questions