a:selected doesn't work.

[nashsaint]

Hi,

 

I have a problem with my menu, it's only a simple text menu with simple text decorations.  the link, hover and active works but the selected doesn't.  When a link is clicked it only shows the "a" state.

 

This menu is saved on header.php which is then called by pages using php include command.

 

#navbar a {

font-family: Verdana, Geneva, sans-serif;

color: #FFF;

text-decoration: none;

}

#navbar a:hover {

text-decoration: underline;

color: #202020;

}

#navbar a:active {

color: #333;

font-style: italic;

}

#navbar a:selected {

color: #202020;

text-decoration: underline;

}

 

help is greatly appreciated.

 

thanks.

[jackpf]

Do you not mean a:active?

[nashsaint]

no, i mean a:selected. 

 

my a:active works fine as the link turns into italics when i click on it.  but when the site is displayed after the click, the links goes back to a:link state instead of a:visited.

[jackpf]

a:visited only takes effect when you've previously been on that page, so it shouldn't.

 

Is a:selected even a proper pseudo-class? I can't find anything on google.

[Axeia]

it's visited, not selected.

And if you're looking for CSS way to style the current page different you're out of luck. Need to do that via some scripting language and an extra id/class.

[TheFilmGod]

If you are looking for "visited" then make sure to do it like this:

 

#navbar a {
   font-family: Verdana, Geneva, sans-serif;
   color: #FFF;
   text-decoration: none;
}
#navbar a:visited {
   color: #202020;
   text-decoration: underline;
}
#navbar a:hover {
   text-decoration: underline;
   color: #202020;
}
#navbar a:active {
   color: #333;
   font-style: italic;
}

 

LoVe HAte - For the links to work properly in some browsers, you need to put the psuedo classes in that order.

 

If you are trying to style the "current" tab that applies to the current page:

 

You need to add a "current" class to the <li> or <a>

 

<ul>

<li class="current"><a href="#">Currently styled link</a></li>

<li><a href="#">Normal link</a></li>

</ul>

 

#navbar a {
   font-family: Verdana, Geneva, sans-serif;
   color: #FFF;
   text-decoration: none;
}
#navbar a:visited {
   color: #202020;
   text-decoration: underline;
}
#navbar a:hover {
   text-decoration: underline;
   color: #202020;
}
#navbar a:active {
   color: #333;
   font-style: italic;
}
#navbar li.current a {
styled properties...
}

[SuperBlue]

a:selected doesn't exist as far as i know, and it would still not disable the link.

 

To "disable" the link, you would need to remove the a tags for the requested page, on the server-side. Remember that a link to the same page is bad, unless its a section link.

 

 

Not as bad as some people suggest however, since you could just throw in a nofollow attribute for SE's, and style them differently. But then the question comes up, why you would have a clickable link to the same page in the first place.

 

If using lists, then i suggest simply removing the a tags, this also requires less styling. You could also shift the a tags with a normal paragraph, whenever POSTID == REQUESTEDID..