Link Color Isn't Working

Hi there! I’m having a little trouble with hyperlinks displaying appropriately on my website:

They’re supposed to show up green (#008000), but I’m not seeing any change from the standard text. Each of these posts was constructed in the standard Wordpress editor, rather than Cornerstone, but I’d think that the theme-standard protocols would still apply.

In the event that those settings didn’t apply, I also tried customizing the CSS in a number of ways with different solutions I’ve found from other users who have had similar issues. No luck.

Any insight into where I’m going wrong would be appreciated!

Hi @ScottSummers,

Please find and remove your custom CSS:

a:link {
    color: #000;
}

a:hover {
    color: #008000;
}

a:active {
    color: #008000;
}

a:visited {
    color: #000;
}

a:link {
    color: #000;
}

a:hover {
    color: #008000;
}

a:active {
    color: #008000;
}

a:visited {
    color: #000;
}

a:link {
    color: #000;
}

a:hover {
    color: #008000;
}

a:active {
    color: #008000;
}

a:visited {
    color: #000;
}

a:link {
    color: #000;
}

a:hover {
    color: #008000;
}

a:active {
    color: #008000;
}

a:visited {
    color: #000;
}

Then navigate to X > Theme Options > Typography > SITE LINKS > change SITE LINKS and SITE LINKS HOVER:

Hope it helps :slight_smile:

Hey thai,

Thanks for reaching out! I see where that’s rendering in the source code, but I have no idea what’s causing it. Here’s a list of everything I checked:

The individual post page (rendered using the Wordpress editor, not cornerstone).
The cornerstone editor for each page (just in case).
The customizer > Additional CSS

Everything is set appropriately in SITE LINKS and has been for a long time. To my knowledge, I also haven’t changed anything in theme settings. (Wouldn’t know where to find it in the first place.)

Any ideas where said custom CSS might be hiding?

EDIT: A ha! Found it! That CSS is controlling the header because the default settings kept turning the links the wrong color. Is there a way to confine that CSS to the header so that it’s not bothering the rest of the page? (It’s actually in the settings for the link elements in the header right now.)

Hey Scott,

To confine your custom CSS to the header only, you can replace your CSS with the following:

.x-masthead a:link {
    color: #000;
}

.x-masthead a:hover {
    color: #008000;
}

.x-masthead a:active {
    color: #008000;
}

.x-masthead a:visited {
    color: #000;
}

.x-masthead a:link {
    color: #000;
}

.x-masthead a:hover {
    color: #008000;
}

.x-masthead a:active {
    color: #008000;
}

.x-masthead a:visited {
    color: #000;
}

.x-masthead a:link {
    color: #000;
}

.x-masthead a:hover {
    color: #008000;
}

.x-masthead a:active {
    color: #008000;
}

.x-masthead a:visited {
    color: #000;
}

.x-masthead a:link {
    color: #000;
}

.x-masthead a:hover {
    color: #008000;
}

.x-masthead a:active {
    color: #008000;
}

.x-masthead a:visited {
    color: #000;
}

Here are some related links for further reading, this could help you in finding and implementing some CSS fixes:

Hope this helps!

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