CSS link states 1

[cbhead]

Hi,
I have built an HTML page in Dreamweaver using CSS to define the link, active , visited and hover states of my page links.
At the moment active and hover are underlined. I also have a different colour for link and visited.

I need to know how to make visited links appear in a different colour but also appear underlined when the mouse moves over them (hover). However, I do not want the underlining to remain when I move the mouse away from the visited link.

This is probably a very simple problem to solve, if anyone knows the answer I would be grateful!

This is the current code in my stylesheet.

a:link {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
font-weight: bold;
color: #000099;
text-decoration: none;
}

a:hover {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: bold;
color: #970097;
text-decoration: underline;

}
a:visited {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: bold;
color: #970097;
text-decoration: none;

}
a:active {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: bold;
color: #970097;
text-decoration: underline;
}

Thanks,
Cbhead.

 

[ChrisHunt]

Define your pseudo-classes in the order a:link, a:active, a:visited, a:hover.

-- Chris Hunt

http://www.extracon.com

http://www.mcgonagall-online.org.uk

http://www.napitalia.org.uk

http://www.leicesteryha.org.uk

 

[cbhead]

So simple and it works!

Thanks Chris.