Override color of links in certain areas

[dannikb]

Hi, I’m using the Pro theme with the Integrity and am attempting to change the (non-hover) color of certain links.

I’ve set the “Site Links” in Theme Options > Typography to the colors I want the majority of links to use (a blue color). However, in some places, I use that same blue color as the background of the section. In those cases, I obviously don’t want the links to be the same color blue because they are then invisible. So, I’ve tried to overwrite the font color in several ways, but it’s not working.

Currently, I have a span tag applied to those links with a class name like “home-event-name”:
<span class="home-event-name">

and then I’ve set the following in my Global CSS:

.home-event-name {
  color: white !important; 
  font-weight: bold;
}

But this solution is not working. Is there a better way?

Note: I have white selected as the font for the entire text element, and all the non-link text shows up in white just fine.

[paul.r]

Hi Dannette,

Can you provide us the url of the page where we can see the page.
It’s most likely that your selector is incorrect.

You may add your class to your text element.

then change your css code to this.

.home-event-name a {
  color: white !important; 
  font-weight: bold;
}

Hope that helps

[dannikb]

That worked! Thank you so much.

[jade]

You’re welcome, Dannette.