How to highlight current menu item in menu?
erniem - April 27, 2008 - 19:52
Does anyone know the best way to do this using Drupal's menu system?
So, for instance, if my menu contains an entry for Page 1, Page 2, and Page 3 of an article and the user is on page 3, I want Page 3 in the menu to be bold/highlighted.
I looked around the forums and couldn't find anything on this, so thanks for any help.
class=active
Drupal should set the class for the <a> or <li> element to be active when it is the selected menu item. You can then add some CSS to style that as you wish.
style.css
li a.active {font-weight: bold;
}
Richard Garside
www.richardsprojects.co.uk
overriding li a.visited ?
Thanks very much for the reply Richard. Here's a slight complication:
I have my CSS set up so that visited links in menus appear gray. If I set active links to be, say, red, the gray (visited) style seems to override the red (active) style. Any way to make it so that the active item stays red while the non-active visited items stay gray? Non-active non-visited menu links should stay black (my default link style) throughout.
Thanks again!
Specific CSS
The browser always looks for the most specific CSS style rule to use for a certain HTML element.
You could try using a:visited.active as your style selector.
If you really want to know how CSS is affecting your webpage you should use Firebug. It's an extension for the Firefox web browser that among many other things lets you point at the screen and see what CSS rules are being applied.
Richard Garside
www.richardsprojects.co.uk