Показать текстовое оформление при наведении указателя мыши на div

Question

Мне было интересно, как я могу сделать ссылку синей, когда они навешиваются на весь div, а не только на ссылку. Можно ли это сделать только с HTML & CSS?

Для примера: Если бы у меня было (jsfidde), как бы я мог сделать ссылку синей, если вы только нависли над серой, а не с реальной ссылкой?

<style> 
    #parent { 
     background-color: gray; 
     height: 100px; 
     width: 200px; 
    } 
    #parent img { 
     margin: auto; 
     line-height: 90px; 
    } 
    #caption a { 
     text-decoration: none; 
     color: black; 
    } 
    #caption a:hover { 
     color: blue; 
    } 
</style> 
<div id="parent"> 
    <img src="http://www.cedexis.com/images/icons/32-social.png?1389641973" /> 
    <div id="caption"> <a href="jsfiddle.net">This is a caption</a> 

    </div> 
</div> 

Answer 1

#parent:hover a 
{ 
    color: blue; 
} 

Answer 2

DEMO

#parent:hover #caption a { 
    color:blue; 
} 

Answer 3

Как это: http://jsfiddle.net/techsin/7MLSb/2/

#parent:hover a { 
    color: blue; 
} 

когда родитель парил превратить все элементы а в них синим.

Answer 4

Используйте этот

#parent:hover #caption a { 
    color: blue; 
} 

Вместо этого

#caption a:hover { 
    color: blue; 
}