Classic social sharing - problem on homepage

[IRIMAGE]

Hello, I have inserted this code into global css when I created website and everything was ok till now.

code: .x-entry-share { border-color: #000000; } .x-entry-share { color: #000000; } .x-share { color: #F9423A; background-color: #000000; } .x-entry-share .x-share:hover { background-color: #000000; } .x-slider-container.below { border: none; }

Suddenly classic social sharing icons appear all black on homepage. (www.ir-image.si) I noticed this today. On other pages they are ok. I can’t find the cause of this problem? Help would be appreciated.

This problem appeared suddenly and by itself. I haven’t change anything here …

[rad]

Hi @IRIMAGE,

Thanks for reaching out.

You have added another CSS that changes it to black, please check this screenshot

The A:link CSS is placed 4 times in multiple places, and it overrides the color #F9423A.

The fix is removing that styling, I think you added them on text element wrapped in <style></style> as shown here.

Thanks!

[IRIMAGE]

Hello,
thank you for your reply and help to salve the problem. This CSS was placed to change color of the text links. I have putted them directly into text edit field in global block that is placed in classic slider on homepage.

Because I have coloured footer (reddish colour) and links in it must appear white - I have set hover color for the links white. Problem here is if links are on white background. The are not seen on hover because they turn to white color. That is why I have putted this CSS in text edit of text element. I didn’t know that this would interfere with classic sharing links in the footer section.

How can I salve the problem so this CSS would not interfere with classic sharing icons - or if there is any other way so I can make links on white colour appear red without this additional CSS?

Thank you!

[rubin]

Hey There,

The cleanest way to solve this is by removing all the custom CSS related to “a” that you’ve added and only target the content section links by adding following CSS to the Custom CSS section in the theme options:

.content a { color: #000000; }

Hope that helps!

[IRIMAGE]

Thank you I solved it.
The right code was - .content a: hover { color: #F9423a; }

Br, Peter

[nabeel]

We’re glad you sorted it out Peter.

Cheers!