I am trying to change properties of parent element when hover on child element. Here is my HTML
<div class="social-icons">
<div class = "innerSocialDiv">
<a href="#" target="_blank" class="fa fa-facebook fa-lg" title="facebook"></a>
</div>
</div>
I need to change a CSS property of innerSocialDiv
when hovering on fa-facebook
.
Here is what I did in my CSS:
.fa-facebook:hover + .innerSocialDiv{
background-color: black;
}
But it's not working.