According to a trick found in Stack overflow, I can change the background of the parent element hovering a child like this:
parent sibling { }
parent sibling:hover { }
parent:hover sibling { }
But I need to change the background color hovering different child elements. For example, hovering the Facebook button, the background goes blue, while hovering the Google + button, the backgroud goes red.
I've tried this:
<div class="share_box">
<div class="white-container">
<div class="facebook-sibling"/>
<a class="facebook-child-button"/>
<div class="twitter-sibling"/>
<a class="twitter-child-button"/>
<div class="googleplus-sibling"/>
<a class="googleplus-child-button"/>
</div>
</div>
but for multiple buttons it didn't work. The result I expect is similar to: