CSS não tem seletor que resolva anterioridade, mas no seu caso um "duplo hover" pode resolver (funciona no IE11, inclusive):
.main{
width: 100%;
height:50px;
}
.child{
width:50px;
height:50px;
background-color:#F00;
display: inline-block;
margin-right: 5px;
}
...0
A resposta do @Bacco está ótima, no entanto aonde existem espaçamentos se passar o mouse acidentalmente neles o :hover ao elemento pai vai ser aplicado:
Note como ficou amarelo, no caso do exemplo não ocasiona problemas, mas se por acaso precisar de algum efeito mais complexo no hover, isso pode...
4
A resposta do @Bacco está ótima, no entanto aonde existem espaçamentos se passar o mouse acidentalmente neles o :hover ao elemento pai vai ser aplicado:
Note como ficou amarelo, no caso do exemplo não ocasiona problemas, mas se por acaso precisar de algum efeito mais complexo no hover, isso pode...
