Hover text visited colour?

T

T.J.

Hi,
On this page
http://www.sim64.co.uk/snooper-evolution.html

I have the link, visited and active colours all the same
and have the hover doing the opposite

a:link {color: #800000; font-weight:bold}
a:visited {color: #800000; font-weight:bold}
a:hover { background-color: #800000; color: #ffffff; font-weight:bold}
a:active {color: #800000; font-weight:bold}

The problem is, when hovering over a visited link the
a:visited is overriding the a:hover
and the font colour ends up the same as the background colour,
how is the best way to get over this.
(critiques of page would be appreciated to)
Many thanks.
 
E

Els

T.J. said:
Hi,
On this page
http://www.sim64.co.uk/snooper-evolution.html

I have the link, visited and active colours all the same
and have the hover doing the opposite

a:link {color: #800000; font-weight:bold}
a:visited {color: #800000; font-weight:bold}
a:hover { background-color: #800000; color: #ffffff; font-weight:bold}
a:active {color: #800000; font-weight:bold}

The problem is, when hovering over a visited link the
a:visited is overriding the a:hover
and the font colour ends up the same as the background colour,
how is the best way to get over this.

By using correct order in your stylesheet.
You obviously want a:hover to override a:active, you need to place it
after a:active in your stylesheet.
Correct order is link, visited, active, hover.
 
E

Els

Els said:
By using correct order in your stylesheet.
You obviously want a:hover to override a:active, you need to place it
after a:active in your stylesheet.
Correct order is link, visited, active, hover.

Sorry, forget what I said, order is as you had it - I'm in doubt now
about the :active style though. It's always placed after :hover, but
shouldn't interfere with hover. Also, looking at the link you gave, it
works fine in my browser. (tried with the link "click here" near the
bottom of the text)
 
S

Steve Pugh

T.J. said:
http://www.sim64.co.uk/snooper-evolution.html

I have the link, visited and active colours all the same
and have the hover doing the opposite

a:link {color: #800000; font-weight:bold}
a:visited {color: #800000; font-weight:bold}
a:hover { background-color: #800000; color: #ffffff; font-weight:bold}
a:active {color: #800000; font-weight:bold}

The problem is, when hovering over a visited link the
a:visited is overriding the a:hover
and the font colour ends up the same as the background colour,
how is the best way to get over this.

I guess that (a) you're using IE and (b) you're hovering over the link
after immediately going back from the linked page. Is there a dotted
outline around the link? Click elsewhere on the page. See the dotted
outline vanish. Now hover the link. All should be okay.

The link is in the active state and because :active is defined after
:hover in your CSS the color is being taken from :active and the
background-color from :hover.

This would not have been a problem if you had followed the standard
advice to always define color and background-color together.

Steve
 
T

T.J.

Steve Pugh said:
I guess that (a) you're using IE and (b) you're hovering over the link
after immediately going back from the linked page. Is there a dotted
outline around the link? Click elsewhere on the page. See the dotted
outline vanish. Now hover the link. All should be okay.

The link is in the active state and because :active is defined after
:hover in your CSS the color is being taken from :active and the
background-color from :hover.

This would not have been a problem if you had followed the standard
advice to always define color and background-color together.

Steve

Thanks,
It was when going straight back to the page, so as you say it was the
:active that was taking precedence, but even when I had put a
background to the active
a:active {color: #800000; font-weight:bold; background-color: #ffffff;}
it still meant hovering over it didn't work a desired.
I think I have now overcome the problem by switching the order
of the CSS
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,744
Messages
2,569,484
Members
44,903
Latest member
orderPeak8CBDGummies

Latest Threads

Top