CSSスプライトを使用していますか？

Question

私はcssスプライトを使ってナビゲーションバーを作ろうとしています。私はイメージを持っていますが、今はコードの問題です。

.navi a{ 
display:block; 
float:left; 
height:40px; 
overflow:hidden; 
background-position:left top; 
} 
navi a:hover img{ 
margin-top:-40px; 
} 

とHTMLは次のとおりです：現時点では、私が働いている

<div class="topbar"> 
<img alt="title" src="title.png"/><br/> 
<div class="navi"> 
<a href="index.html" class="home"><img src="home_up.png"/></a> 
</div> 
</div> 

すべてが通常の画像があり、高さが正しく、それは画像オフの残りの部分をトリミング、しかしとき私はそれが何もしないことを浮かべる。助言がありますか？ありがとう

Answer 1

最初のスタイルは.navi aですが、次に書いているのはnavi a:hover imgです。これは、第2のスタイルが、<navi />要素内にあり、クラス名がnaviの要素内ではなく、ホバリングされたリンク内のすべての画像に適用されることを意味します。

ので、代わりの：

navi a:hover img 

あなたが書く必要があります。

.navi a:hover img