CSS圖片精靈 - 無效的屬性值

Question

學習使用精靈菜單，現在按照教程。但由於某種原因，Chrome在某些背景位置行上給我提供了「無效的屬性值」。第一個，位置0 0工作正常，但其他兩個與-33 0和0 - 33將無法正常工作，這意味着我的網站現在只顯示1個按鈕，懸停不適用。我使用的是現在的畫面是197x65

#sidebar .content .follow a { 
          display: block; float: left; height: 32px; 
          background-image: url('http://s23.postimg.org/8ltupgj0r/follow.png'); text-indent: -9999px; 
          margin-right: 5px; 
          } 

          #sidebar .content .follow a.fb { 
           width: 32px; background-position: 0 0; } 
          #sidebar .content .follow a.twit { 
           width: 32px; background-position: -33 0; } 

          #sidebar .content .follow a.fb:hover { 
           background-position: 0 -33; } 

Answer 1

在你需要設置你想要什麼樣的價值型背景位置屬性，PX，EM等CSS理解0，但你需要更具體爲其他值。

#sidebar .content .follow a.twit { 
    width: 32px; background-position: -33px 0; } 
#sidebar .content .follow a.fb:hover { 
    background-position: 0 -33px; }