8 replies [Last post]
perad
Offline
Regular
Last seen: 13 years 1 week ago
Joined: 2006-02-03
Posts: 41
Points: 0

I have an element with an a:hover and an a:visited command yet only the visited works.

Heres my code.

.about a:hover{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color:#CC0000;
}

.about a:visited{
color:#FFFFFF;
}

Have i done something wrong here?

If i remove the color from a:visited the links change color when the mouse hovers over them. Yet when the visited has a color in the hover doesn't work.

It doesn't work for both firefox and IE6

Has anyone got any ideas on how to fix this?

Pman
Pman's picture
Offline
Enthusiast
Sweden
Last seen: 12 years 19 weeks ago
Sweden
Timezone: GMT+2
Joined: 2004-04-15
Posts: 60
Points: 0

mhm...

I might strike you as dumb...but you have declared the a:link ?
Your CSS is somewhat like this:

.about a{
blahblah
}
.about a:{
blahblah
}
.about a:visited{
blahblah
}
.about a:current (or active) {
blahblah
}

And it still don't work ???

Anything that happens to irritate you, will happen atleast once more
- p-ahlqvist.com - Online, not entirely done contentwise, but I'm up

perad
Offline
Regular
Last seen: 13 years 1 week ago
Joined: 2006-02-03
Posts: 41
Points: 0

a:hover a:visited problems

Sorry could you explain better, i have this...

.about {
font: bold 12px Verdana;
color:#FFFFFF;
text-align:center;
background-image: url(images/design-layout_04.jpg)}

.about a:hover{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color:#CC0000;
}

.about a:visited{
color:#FFFFFF;
}

What do you mean by declared the link?

My html is this...

<td class="about" >
<a href="#">About</a></td>

Pman
Pman's picture
Offline
Enthusiast
Sweden
Last seen: 12 years 19 weeks ago
Sweden
Timezone: GMT+2
Joined: 2004-04-15
Posts: 60
Points: 0

a:hover a:visited problems

Hey...

My being swedish might be an issue here Wink.

I was reffering to you need to tell the browser how a link look like:
.about a{
style here
}

Then you need to tell the browser what happens if you hover it:
.about a:hover{
style here
}

the same for visited links and active links and so on... Each of these should have it's own declaration/styling...Try to and post back if it's still the same.

Ohh..do you have an URL to glance at ? Might be easier to find it if not having to ask you things and you'll have to reply.

Anything that happens to irritate you, will happen atleast once more
- p-ahlqvist.com - Online, not entirely done contentwise, but I'm up

perad
Offline
Regular
Last seen: 13 years 1 week ago
Joined: 2006-02-03
Posts: 41
Points: 0

a:hover a:visited problems

www.jasonstanley.co.uk/test/

btw i don't normally use tables in my design, this is for a tutorial on slicing, i couldn't be bothered to arrange it all with CSS.

style sheet is www.jasonstanley.co.uk/style.css

I did what you suggested but it still doesn't appear to work

Pman
Pman's picture
Offline
Enthusiast
Sweden
Last seen: 12 years 19 weeks ago
Sweden
Timezone: GMT+2
Joined: 2004-04-15
Posts: 60
Points: 0

a:hover a:visited problems

Mhmm...what it depens on, I cant tell you. I'll leave that to more experianced CSS'ers, ok ?

But what happens is that when clicked every link on that page, the browser remembers the links as visited. Clean your cache and it will work 'til you click them again...

Remove the .about a:visited style declaration and try again

Anything that happens to irritate you, will happen atleast once more
- p-ahlqvist.com - Online, not entirely done contentwise, but I'm up

perad
Offline
Regular
Last seen: 13 years 1 week ago
Joined: 2006-02-03
Posts: 41
Points: 0

a:hover a:visited problems

Pman wrote:
Remove the .about a:visited style declaration and try again

If i remove that declaration the link will come up as purple once it is clicked, this will detract from the rest of site, i need links to stay white whether they have been visited or not. This gives the site the look i want.

Pman
Pman's picture
Offline
Enthusiast
Sweden
Last seen: 12 years 19 weeks ago
Sweden
Timezone: GMT+2
Joined: 2004-04-15
Posts: 60
Points: 0

a:hover a:visited problems

Of course. I understand...

Ok, I spotted one more thing that may or may not have anything to do with this, but you hvae no doctype on your document. You might wanna do that. This is what gives when trying to validate you site:

http://validator.w3.org/check?uri=http%3A%2F%2Fwww.jasonstanley.co.uk%2Ftest%2F&charset=%28detect+automatically%29&doctype=Inline

I don't know it is connected to your problem, but many time it is a start to get the right doctype for your site...

Anything that happens to irritate you, will happen atleast once more
- p-ahlqvist.com - Online, not entirely done contentwise, but I'm up

HellsBells
HellsBells's picture
Offline
Leader
Bedford, UK
Last seen: 12 years 10 weeks ago
Bedford, UK
Joined: 2004-04-07
Posts: 851
Points: 0

a:hover a:visited problems

Also just check you've declared the link styles in the correct order or it won't work properly:

a:link
a:visited
a:focus
a:hover
a:active

Lord Vader, Former Handle Annakin

My strategy is so simple an idiot could have devised it!

"Also, your CSS (no offence) makes me want to gouge my eyes out with a rusty spoon" - TPH