Wrong hover color in classic social sharing

Hi all,

I’ve been discussing this in another topic, but the solutions are not working so I’m adding our login details to see if you can help me out.

We are using the classic social sharing buttons underneath our posts, and on hover I want the icons to be white and the background to be the colour dark blue we are using everywhere (#012E40).
This is the code I’m using:
.entry-wrap .x-entry-share .x-share:hover {
background-color: #012E40;
color: white;
border-radius: 50px;
}

The icons color and border-radius are working just fine, but the background-color displays as some kind of grey instead of the dark blue. I’ve tried other color methods (rgb, hsl), they don’t work either; opacity doesn’t influence it. I’m lost!

Hope you can see where I’m missing something and help me out here!

Hi there,

Thanks for writing in.

It’s working, it’s displaying the #012E40 background when hovered. What you need is to change it’s opacity to 1. Example,

.entry-wrap .x-entry-share .x-share:hover {
background-color: #012E40;
opacity: 1 !important;
color: white;
border-radius: 50px;
}

Or maybe are you referring to idle color?

Hope this helps.

You are a genius @Rad! The !important-part did the trick!

Thank you so much!

You’re welcome :slight_smile:

On behalf of my colleague, you’re welcome. Cheers! :slight_smile:

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.