выберите: HOVER, примените стиль к ребенку: элемент HOVER не работает

Question

Может ли кто-нибудь увидеть, что я делаю неправильно здесь?

У меня есть текстовые элементы внутри <a>, которые я хочу text-decoration:none, когда <a> завис над. См. HTML ниже, который, я считаю, должен работать, но когда я навешиваю на это <a>, текст по-прежнему подчеркивает ребенка <h2> и <p>.

HTML

<a href="" class="link-box"> 
    <div> 
     <span class="icon-stat"><i class="fa fa-users"></i></span> 
     <h2>Membership Management</h2> 
     <p>Some text here</p> 
    </div> 
</a> 

CSS

a.link-box:HOVER h2, a.link-box:HOVER p { 
    text-decoration: none; 
} 

Answer 1

a:hover{ 
    text-decoration: none; 
} 

Попробуйте

http://jsfiddle.net/L3pxr0tx/