Hi,
I'm working on a idea where my a:link have one state (blue, no underline etc) with a a:hover being white. I want my visited links to have the same state as a:link and a:hover. Is this possible? supported in most common browsers?
thanks giles
Hi,
I'm working on a idea where my a:link have one state (blue, no underline etc) with a a:hover being white. I want my visited links to have the same state as a:link and a:hover. Is this possible? supported in most common browsers?
thanks giles
Here's how you can style the a tags (normal and visited) and style the hover separately.
a
{
color:#6c7492;
font-weight:bold;
text-decoration:none;
}
a:hover
{
border-bottom:1px solid #6c7492;
}
If you've using those pseudo classes, I don't see why not.
a:visited, a:hover {
...
}
a, a:link, a:hover, a:visited, a:active {text-decoration: none; color: blue;}
should work on all CSS-enabled browsers, although this is a bad idea (currently offline, Google Cache)
To make a:hover
white, either remove it from the above rule and make a special rule for it or add just:
a:hover {color: white !important;}
It's completely possible as sblundy points out. However, if you make a rule like that there will no longer be any visual cue that the user is hovering over a link that was previously visited.
Also, remember to specify the rules in this order:
a:link { }
a:visited { }
a:hover { }
a:active { }
Otherwise you may have unexpected results because all of these rules have the same specificity. The order is important.
EDIT: CSS2 allows the chaining together of pseudo-classes. This could be used to fix the [potential] usability problem your request creates.
a:visited:hover { }
However, I don't know if this convention is widely supported.
The mnemonic I was taught for remembering which order to put your CSS links in is "LoVe HAte": link, visited, hover, active.
Sticking :focus in there is usually not a bad idea, as well.
Of course, if you're making all states of a link look the same by listing selectors with commas, then the order doesn't matter.