How to change colour of links?

[LaunchPad777]

Hi there,

Using the Genesis Sample theme...

Just spent the best part of 2 hours trying to change the colour of links on this site.
http://www.gpmotorworks.co.za/contact-us/

Using Chrome so used the Inspect Element to identify the code and made the changes as follows:

/*CHANGE HYPERLINK COLOR*/
.entry-content a {
border-bottom: 1px solid #ddd;
color: #10073C;
}

/*CHANGE HOVER COLOR*/
.entry-content a:hover {
color: #D4CBFA;
}

But this had absolutely no affect on the links at all.

Then tried:

/* unvisited link */
a:link {
color:#10073C;
} 

/* visited link */
a:visited {
color:#404040;
} 

/* mouse over link */
a:hover {
color:#D4CBFA;
} 

Please tell me where I am going wrong...

Also, what code would I use to change the colour of the email address?

Best regards

Greg

http://www.gpmotorworks.co.za

[LaunchPad777]

Hi there,

Sorry I seem to have had a caching problem....couldn't see the changes taking effect.

However, the change to the second batch of code above has also caused changes to the text in the Nav Menu which I didn't want.

How do I change the Nav Menu text so that it is not affected by the links change?

Appreciate your assistance...

Regards
Greg

[LaunchPad777]

Anyone have any ideas?

[aan91]

no idea

---

Android Blog >>>> Apk Baru – Apk Gratis

[Porter]

The proper identifiers for your navigation are as follows:

.genesis-nav-menu a:hover {
     your code
}

"genesis-nev-menu" specifically. Have one piece of code with "a:hover" for the hover effect, and one without ":hover" for the normal color of the navigation. If that doesn't work, add .nav-primary before the above identifiers.

---

Buy me a beer? | Try DigitalOcean VPS Hosting

[gcampton]

I assume you're just adding css to the bottom on the stylesheet?
Otherwise it should not have overridden it.

What you should be doing is looking for the changes you want to make.
For instance links in content:

a {
   color: #333;
}

So rather than putting new declaration at the bottom with your color just hit CTRL+F to "Find" text on the page, look for "a {"
which is around line 80 or so, then replace it with your new color.

This will NOT change the color of buttons or nav menus because the rest of the stylesheet (Those are declared afterwards) still remains the same.

[LaunchPad777]

Thanks Porter....

I didn't need to make changes to the Nav Menu after all.....

Regards
Greg

[LaunchPad777]

Thanks gcampton,

I first removed the code at the end of the stylesheet and then searched for and made changes as you suggested.
Unfortunately this didn't have the desired result.

I then checked the code again using Inspect Element and then searched and made the changes here:

.entry-content a {
border-bottom: 1px solid #ddd;
color: #10073C;
}

This was successful.

The question is - why didn't this work when I placed the code at the end of the stylesheet in the beginning? (see beginning post).

Best regards
Greg

[Author]

Posts