I've set up CSS formatting for links with the following code:

a:link {color: #00728B;}
a:visited {color: #7497A7;}
a:active {color: #00728B;}
a:hover {color: #00728B;}

I just noticed that text I have marked as a target with the <a name> tag does not have the "link" color applied but does change on hover. This is a bit distracting since it suggests to users that these are clickable links when they are not.

Here's an example.

Is there a way to differentiate the hover behavior so it applies to a href but not to a name?

Thanks,

Andrew

Addendum: I just noticed that this happens in Firefox but not in IE7. Hmmm?

A.

Not unless you do something like:
a.href:link {}
a.href:visited {}
a.href:hover {}
a.href:active {}
Then had all your <a href> with <a class="href" href>, also please note, hover needs to come before active. NEEDS to.

You don't need the <a name... blah blah> - all you need to do is us an ID on the anchor --like this:

<h1 id="top"></h1>

Then to link to it it's the same: <a href="#top">go top</a>

Thanks for the input. These targets are throughout a 2800 page e-book with probably several thousand anchors. I'm not going to rename the anchors. I think Jerod's solution of adding a class to each href tag (but not the name tags) could be done easily with a search/replace. It seems a bit sloppy though (to need to add a class just to differentiate it from an anchor).

Any reason why hover needs to come before active? Just the standard or does it mess with function?

Andrew

Any reason why hover needs to come before active? Just the standard or does it mess with function?

That is the standard - link, visited, hover, active - in that order when using pseudo classes.

As for your css problem, I think you could fix it with specificity rather than adding a class, especially if your anchors are consistent throughout.

Originally Posted by LadynRed

fix it with specificity

I'm intrigued. What does this mean?

Andrew