Изменение изображения и цвета фона при наведении на любой элемент

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.