いずれかの要素にカーソルを置くと画像と背景色が変わります

Question

背景色を持つdivがあり、背景画像を持つ<a>が含まれています。現在、画像の上にマウスを置くと、divと画像の背景色を変更することができます。しかし、背景色の目に見える部分にカーソルを合わせると（ほとんどが画像で覆われます）、背景色だけが変化し、画像は変化しません。

ここにコードがあります。私は画像や背景色のい​​ずれかにカーソルを合わせると

HTML

<div id="kitchenCol"> 
    <a href="#" class="rollover" title="Kitchens"></a> 
    <p></p> 
</div><!-- End div kitchenCol --> 

CSS

#kitchenCol a.rollover 
{ 
    display:block; 
    width:279px; 
    height:576px; 
    background:url(../images/kitchenCol.jpg); 
} 

#kitchenCol a.rollover:hover{background-position:-279px 0;}  
#kitchenCol{background:#cccccc;} 
#kitchenCol:hover{background:#936768;} 

は、どのように私はそれ画像と背景色の変更ので、両方行うことができます。

Answer 1

は、私は理解して完全にわからないが、これを試してみてください。

#kitchenCol:hover a.rollover{background-position:-279px 0;}

代わりの#kitchenCol a.rollover:hover{background-position:-279px 0;}。

IE6やIE7でも動作しないマインド。