Menu
Hallo,
i use some valid CSS code and like to have this diff. colors in my menu. I use this style for the links:
[code=php]#nav1 a:link, #nav1 a:visited {
display:block;
width:80px;
color: #3300FF;
text-decoration: none;
background-color: transparent;
}
#nav1 a:hover, #nav1 a:active {
color: #333333;
background-color: transparent;
}
the hover, link and visited is OK but the active will not work, any idea?
[i]Originally posted by PhillMc [/i]True so far.
[B]You have to define the psuedo-classes in a particular order[/b][/quote]
[i]Originally posted by PhillMc [/i]Oh, head on collision with a fridge!!! :eek: ?
[B]seperately[/b][/quote]
[i]Originally posted by lavalamp [/i]
[B]Oh, head on collision with a fridge!!! :eek: ? [/B][/QUOTE]
[code=php]#nav1 a, #nav1 a:link, #nav1 a:visited {
display:block;
width:80px;
color: #3300FF;
text-decoration: none;
background-color: transparent;
}
#nav1 a:focus, #nav1 a:hover {
color: #333333;
background-color: transparent;
}
#nav1 a:active {
color: #666666;
background-color: transparent;
}[/code] [i]Originally posted by Neczy [/i]Er, no. ?
[B]is that image named fag? :p[/B][/QUOTE]
[i]Originally posted by lavalamp [/i]
[B]Seems to be working for me:
Attachment: faq.jpg[/B][/QUOTE]
a:link {
color: #3300FF;
text-decoration: none;
}
a:visited {
color: #3300FF;
text-decoration: none;
}
a:hover {
color: #333333;
text-decoration: none;
}
a:active {
color: #333333;
text-decoration: none;
}a, a:link, a:visited {
color: #3300FF;
text-decoration: none;
}
a:focus, a:hover, a:active {
color: #333333;
text-decoration: none;
}[i]Originally posted by lavalamp [/i]
[B]Both sets of styles are working, but just strangely not for you.
Try hitting Ctrl+F5 (forced refresh). That should re-download every single file and hopefuly get it working again, although clearing the cache should have done that anyway.
Are you using Opera by any chance? Opera is notoriously bad for caching EVERYTHING. [/B][/QUOTE]
[i]Originally posted by olaf [/i]On my site I've set all of the :focus, :hover and :active states to look the same.
[B]I cant't see an sctive state on your site...
but i see active states on zeldman's site (the navigation in the right colomn) [/B][/QUOTE]
[code=php]a:link, a:visited {
font-weight : bold;
text-decoration : none;
color: #785;
background: transparent;
}
a:hover {
font-weight : bold;
text-decoration : none;
color: #530;
background: transparent;
}
a:active {
font-weight : bold;
text-decoration : none;
color: #785;
background: transparent;
}[/code][i]Originally posted by olaf [/i]
[B]what I see on zeldaman's site is the link in a diff. collor if the choosen page is active.[/B][/QUOTE]
[code=php]<a href="/designer/" id="n_designer" accesskey="D" title="Here I am, this is me...">The <span class="underline">D</span>esigner</a>[/code]the second easiest way would be to go round to any links you want to be "active" on a particular page and give them all a class[/QUOTE]
[i]Originally posted by olaf [/i]Yeah, but it's still the second easiest. ?
[B]this is a really "hard" way, for sure its possible.[/B][/QUOTE]
[i]Originally posted by lavalamp [/i]
[B]The active state occurs when you're actually clicking the link (ie: when the link is active).
CSS can't detect whether the href of a link leads to the same page or not.
A "smart server-side language" gimmick is definately the easiest way, the second easiest way would be to go round to any links you want to be "active" on a particular page and give them all a class, then style that class accordingly. [/B][/QUOTE]
0.1.9 — BETA 5.8