how can i make a:hover (in CSS) work with visited links?

Question

a:hover tag applies to the links only when they have not been clicked before.

(when a user clicks on the link, goes to the next page and then comes back to the same page, the link will not look as it was originally)

i tried disabling this by using the same prameters in a:link but the a:hover stopped working. is there any way to make it work with visited links? or is there any other tag that has the same effect as a:hover?

Answer 1

Here are the CSS a: classes.

a:link {color: #FF0000} /* unvisited link */
a:visited {color: #00FF00} /* visited link */
a:hover {color: #FF00FF} /* mouse over link */
a:active {color: #0000FF} /* selected link */

These need to be defined in this order or it won't work (according to the w3schools).

Answer 2

I've recently been playing w/ this same scenerio as I build the new site for OU Sooners e-comm site and one trick is to make sure you have link elements listed in this order because after all you're working w/ "Cascading" SS ( in short make sure a:hover is listed after a:visited)

a link
a visted
a hover

Dont forget you can always set a .class style you like for your text links before hand (i.e enclosed in a div tag) then after your links take on thier style you can apply an inline style to your links. ( if that makes anysense at all)

Answer 3

What browser are you using? a:hover works the same on visited and unvisited links in IE6 and Firefox 1.5. Obviously the hover style has to be different from the link or visited style to be visible.

Answer 4

If you define a:visited {} with the same styles as the as a {} then your links should always look the same and a:hover {} should work just fine.

Answer 5

just an added tip

your link psuedo classes must be in the following order or they will cause trouble in some browsers

:link
:visited
:hover
:active

Answer 6

you have to make sure there is no a:visited set in your style sheets anywhere.

If that doesn't work you will have to use JavaScript, which can get complicated.

Answer 7

A:Visited {
font-family:verdana;
font-weight:bold;
color:black;
text-decoration:none;
}