Reverse Colors of Social Icons (already tried other threads)

[Monte]

Hi,

I tried the code from this thread: https://kriesi.at/support/topic/reverse-the-colours-of-the-social-share-buttons/?login_error

which partially worked but I can’t get the hover effect to change to white upon hover on all of the icons. Can you send me my own code for my website for this pretty please?

My social icons are:

Facebook
Twitter
Pinterest
Instagram (preferably the 2016 color)
Google +
Mail

Thank you!

[Josue]

Hi,

Can you post the link to your website please?

Regards,
Josue

[Monte]

Here is my site:

Thanks!

[Josue]

Hi,

Looks like you managed to do it – http://screencast.com/t/rA2pEG2vSSIo

Best regards,
Josue

[Monte]

Hmmm, I can’t see it on the screecast shot or my site either. Not sure what’s going on with it or what else to do :(

I know the code is right and I’ve tried it on another site of mine as well but still can’t see it.

[Josue]

Hi,

have you checked in another browser or computer? can you post a screenshot of your view.

Best regards,
Josue

[Monte]

I still can’t see your screenshots and I’ve tried Safari, Firefox and Chrome. I know I posted above that I thought I had the code right but that was for another thread issue I have open trying to get a gif to post as an image in my sidebar and I can’t see your screenshots on that either.

For this issue, the colors of my icons look right but it’s the hover going back to white that I can’t get to work so a screenshot of it won’t help.

How can I post an image here so I can show you the blank screencast image I’m getting?

[Monte]

Just checking to see if there is another solution for this?

[Ismael]

Hi,

Do you want to change the hover effect of the social icons? Please try this:

#top #wrap_all .social_bookmarks li:hover a {
    color: gray;
    background: transparent;
}

If you want to define different color for each icon, do something like this:

#top #wrap_all .av-social-link-facebook:hover a {
color: #37589b;
background-color: transparent;
}

#top #wrap_all .av-social-link-twitter:hover a {
color: #46d4fe;
background-color: transparent;
}

Best regards,
Ismael

[Author]

Posts