CSS翻轉小精靈

Question

我以前用過這個效果，一切都按順序（就我所見），但它不起作用。我錯過了什麼？

Fiddle here

Sprite here

感謝。

Answer 1

因爲你的精靈水平設置，你會想，以抵消懸停狀態是這樣的：

element:hover { 
background-position: -77px 0; 
} 

Answer 2

恩，你的背景位置是調整頂端開始位置而不是左側起始位置？

Answer 3

你的背景偏移似乎是錯誤的 - 而不是0 77px（這是y偏移量，沿錯軸），嘗試-77px 0

Answer 4

只是改變

background-position: 0 77px; 

到

background-position: -77px 0;