CSS active page highlight

Does CSS allow menu links for the active page to be highlighted?

[kapow]

Does CSS allow text links for the active page to be highlighted (for my menu bar)? If I were using buttons I would have a differnt button colour in the menu bar for the current page, but I'm using text links. I tried the following but it doesn't work. It highlights while the browser is changing from one page to the next but I want it to stay highlighted while the visitor is in that page.

a:link { color:#003366 }
a:visited { color:#003366 }
a:active { color:#FFFFFF; background:#003366;}
a:hover { color:#FFFFFF; background:#003366; }

[piskie]

You need to assign a "class" to display your page in the list of links:

.page { color:#FFFFFF; background:#003366;}

Then you need make the text plain and not linked.
Then you assign the css class to the text possibly using the <span> tag:

<span class="page">Home</Span>

Unfortunately, this means carrying out the unlinking etc on each page.

[tedster]

Unfortunately, this means carrying out the unlinking etc on each page.

It's a monotonous task that many web sites ignore. But I highly recommend it as a usability enhancement. It's an essential feature of user friendly site to give the visitor LOTS of cues as to what their location is -- and that often results in longer visits.

I try to do all of these:

1. The displayed page is not an active menu link
- no link should reload the page you're on

2. Any menu label for the page should look different
than the other menu choices somehow. ALL CAPS works well
for me when the menu labels are short words

3. A page Header of some kind duplicates the exact
same label used in the menu, word for word.

4. A shift occurs in color, image, or icon between
the different major sections of the site.

I've not always been a good boy in this area. But my sites that do follow these four guidelines show a lot of page views per unique.