Forum Moderators: not2easy
A:link { color: red;}
A:hover { color: blue;}
A:active { color: orange;}
A:visited { color: black;}
From my understanding, visited links would still display the hover color when you're on them (in this case blue). But on my website, all my visited links stay black whether you're hovering on them or not, or clicking on them (supposed to be orange, the active link color).
It seems that once a link is visited, the hover and active colors are not working anymore. It'll just show the visited link color. The visited link style will override everything else.
Is this right? It doesn't sound right to me.
It seems that once a link is visited, the hover and active colors are not working anymore.
The various link pseudoclasses all have the exact same specificity in CSS. This means that they override each other easily, necessitating their careful placement in the CSS code. Whichever pseudoclass comes last will override those before it.
In your case, the order is link, hover, active, visited. This means that as you hover over a link, the hover 'state' is overridden (overrode? overrided?) by the active 'state' (where applicable) and the visited 'state'(where applicable). In fact, ALL of your link styles are overridden by the visited pseudoclass because it comes last.
For this reason, the recommended order for link pseudoclasses is link, visited, hover, active. One mneumonic to help remember this order is LoVe/HAte.
Switch them into that order and your links should work fine.
cEM
