Setting a universal hover color

Hi I want all my links on my page to have the same hover color so I wrote:

a:hover{color: #cac000;}

However that did not work. I don’t understand, if you can set:

a {text-decoration: none;}

Should the a:hover work too?

one would have to inspect your code. but generally , hover needs to be set in a specific order. so if you set the a:hover{} after the a{} it will not work. hope that helps.

Bades Design | The One Stop Web Shop

The contact and about links at the top of the page and the the four links in the footer should be affected.

reverse the order… cod it like this:

a {text-decoration: none;}
a:hover{color: #cac000;}


I did both ways and they did not work

You declared the normal state like this: #toplinks a {color:white;} and #footer_content a {color:white;}.

The hover state is just a:hover {color:#cac000;}. Change this to #toplinks a:hover, #footer_content a:hover {color:#cac000;} and it will work.

Your longer normal declaration overwrites your hover declaration (if that makes any sense :slight_smile: )

Yes, it’s an issue of specificity, which is really important to understand.

Thanks, I couldn’t remember the right word.

Thanks guys, I’ll take a look into that

simply put if you have specified the color for more specif areas of the page then those rules will take effect… so the simple answer is DONT have any other anchor:hover rules in your style sheets, or they will override your general rule…

or if you want to do it the heard way… declare the color for all anchors in one place… which is what HueiJ suggested

== : )