CSS troubles! - 10/24/2003 8:50 PM
I have this code in my header
and then I have some links that are like
Quote
quote:
a.coolLink { color: blue; text-decoration:none; }
a.coolLink:hover { text-decoration:underline; }
a:visited { text-decoration: none; color: #660033;}
a:link { text-decoration: none; color: #660033;}
a:hover { text-decoration: underline; color: #D50019; }
a:active { text-decoration: none; }
a.coolLink { color: blue; text-decoration:none; }
a.coolLink:hover { text-decoration:underline; }
a:visited { text-decoration: none; color: #660033;}
a:link { text-decoration: none; color: #660033;}
a:hover { text-decoration: underline; color: #D50019; }
a:active { text-decoration: none; }
Re: CSS troubles! - 10/24/2003 10:51 PM
a:link takes priority over a.coolLink without :link. Try a.coolLink:link, or put the coolLink classes after rather than before the rest of the a pseudoclasses...
Re: CSS troubles! - 10/24/2003 11:17 PM
I figured it out. I forgot to have a a.CoolLink:visited as well, so thats why all the other ones were over ruling it.
! Thanx
! Thanx
Re: CSS troubles! - 10/24/2003 11:25 PM
OK maybe NOT!! LOL
now what happens is, some links when u hover over them underline the link, and some dont.
However, I noticed that when u click on a link that the Hover affect works, and try put ur mouse back over the same link, the hover underline doesnt work anymore.
It has something to do with visited I guess.
Quote
quote:
a:visited { text-decoration: none;}
a:link { text-decoration: none; color: #ffbe5e;}
a:hover { text-decoration: underline; color: #D50019; }
a:active { text-decoration: none; }
a.menulink:link {
color: #ff9900;
text-decoration: none;
}
a.menulink:hover {
text-decoration: underline;
}
a.menulink:visited {
color: #ff9900;
text-decoration: none;
}
a.menulink:active {
color: #ff9900;
text-decoration: none;
}
a:visited { text-decoration: none;}
a:link { text-decoration: none; color: #ffbe5e;}
a:hover { text-decoration: underline; color: #D50019; }
a:active { text-decoration: none; }
a.menulink:link {
color: #ff9900;
text-decoration: none;
}
a.menulink:hover {
text-decoration: underline;
}
a.menulink:visited {
color: #ff9900;
text-decoration: none;
}
a.menulink:active {
color: #ff9900;
text-decoration: none;
}
However, I noticed that when u click on a link that the Hover affect works, and try put ur mouse back over the same link, the hover underline doesnt work anymore.
It has something to do with visited I guess.
Re: CSS troubles! - 10/24/2003 11:37 PM
N/M figured the whole thing out, lol
for a.menulink:visited, u cant have text-decoration: none;
because what will happen is, when u visit a link, and then retry to put ur mouse over the link, it wont underline it, because the visited: part has already been declared for no underlines...
Totally makes sense now..
CSS is tricky! BUT I LOVE IT
for a.menulink:visited, u cant have text-decoration: none;
because what will happen is, when u visit a link, and then retry to put ur mouse over the link, it wont underline it, because the visited: part has already been declared for no underlines...
Totally makes sense now..
CSS is tricky!
BUT I LOVE IT
Re: CSS troubles! - 10/25/2003 12:07 AM
Actually you should put them in this order:
link
visited
hover
active
in order to get visited links with both a hover and an active effect
link
visited
hover
active
in order to get visited links with both a hover and an active effect