A:hover being temperamental

[makzan]

i've found the most frustrating css error ever!

I'm using different classes for my links on my site. I have created a defualt class for my regular links, because of firefox overwriting default links.

However, some of the links work and some don't. They are supposed to be grey and bold, then when you put your mouse over them, they should change to orange, then once visited, go back to grey.

I have checked and rechecked, double checked and pulled my hair out over this, but all classes for each link are spelt properly. There are no " missing or > missing or spelling mistakes whatsoever. This morning, I looked at the page and certain links were working and others weren't. I looked at it about an hour ago, and different links were working. I just looked at it on another computer and different links were working again. I tried copying the html code from one link that was working, to another that wasn't and it worked. Then I tried editing the target by taking just one character out and it worked. But as soon as I changed it back, it didn't work again. All pages point to the same css file and the pages use frames if that makes a difference.

Here is the code in the css file. I've taken out the regular a:link, a:hover and a:visited codes, because they seemed to make no difference:

A.default:link {color: #696969; font-family: verdana, arial; font-size: 9pt; font-weight: bold; text-decoration: none}
A.default:hover {color: #FF9900; font-family: verdana, arial; font-size: 9pt; font-weight: bold; text-decoration: none}
A.default:visited {color: #696969; font-family: verdana, arial; font-size: 9pt; font-weight: bold; text-decoration: none}

A.email:link {color: #0000FF; font-family: verdana, arial; font-size: 9pt; text-decoration: none; font-weight: bold}
A.email:hover {color: #0000FF; font-family: verdana, arial; font-size: 9pt; text-decoration: none; font-weight: bold}
A.email:visited {color: #0000FF; font-family: verdana, arial; font-size: 9pt; text-decoration: none; font-weight: normal}

A.bottom:link {color: #696969; font-family: arial, verdana; font-size: 10pt; font-weight: normal; text-decoration: none}
A.bottom:hover {color: #FF9900; font-family: arial, verdana; font-size: 10pt; font-weight: normal; text-decoration: none}
A.bottom:visited {color: #696969; font-family: arial, verdana; font-size: 10pt; font-weight: normal; text-decoration: none}

A.bottom2:link {color: #696969; font-family: arial, verdana; font-size: 10pt; font-weight: normal; text-decoration: none}
A.bottom2:hover {color: #FF9900; font-family: arial, verdana; font-size: 10pt; font-weight: normal; text-decoration: none}
A.bottom2:visited {color: #696969; font-family: arial, verdana; font-size: 10pt; text-decoration: none}

Please advise as to what to do, before my computer goes out the window! lol I hope this makes sense!

[Span]

Hey makzan, if you still have a computer, try changing the order from:

a.default:link
a.default:hover
a.default:visited

to:

a.default:link
a.default:visited
a.default:hover

[SuzyUK]

Hi makzan
try rearranging the order of your link pseudo classes in your stylesheet

suggested order LVHA -
pnemonic to help remember it..LoVe/HAte

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

HTH
Suzy

edit reason:
fixed BB code error

[edited by: SuzyUK at 11:13 am (utc) on July 1, 2005]

[makzan]

omg, it works.
thanks, luckily i still have the computer!
You know, that's made it more annoying! lol How the order of the code makes that much difference!
You've brightened my day!