a:visited overrides a:active

[Mort]

Hey

Am trying to have a styled menu, with a different shade for the link you are on, and also for links you have visited.

The only problem is, when I click on a link, the a:visited pseudo-selector overrides the class / id i have set for when its on that page. So the on link appears to be the same as a visited one

Any ideas?

 

[trefaes]

Try using

a:link#whatever

to style the current page link - rather than just the ID.

 

[Makhaira]

Create a new CSS declaration for that particular class.

e.g., as well as

a:visited

also declare

a.MyClass:visited

 

[Augmented]

:active should always be set after :visited, due to the nature of the cascade. All the pseudo classes have the same specificity, so setting the order correctly in the cascade means :active will override all the other related pseudo-classes. There's a simple trick to remembering the correct order:

LoVe HAte
=
:link
:visited
:hover
:active

If you can't change the order of the rules, you'll have to override the default cascade order by increasing the specificity of the rule, as above. Using an ID, class or additional selector.