Highlight the expandable section of a menu
Last modified: August 27, 2009 - 00:22
This tip changes the background of an expanded menu section, highlighting that you are in it. It works really well with my tip on highlighting the actual item.
Another thing I do here is "shrink" the menu item font size, but slightly increase the size of the parent item when it is expanded. I also set the background color of the whole menu.
.menu .leaf {font-size:0.9em; background:#FFDAB9;}
.menu .leaf .active {border:1px solid #D2691E;}
.menu .collapsed {font-size:0.9em; background:#FFDAB9;}
.menu .expanded {font-size:1.0em; background:#FFEBCD;}
#sidebar-left, #sidebar-right {background-color: #FFDAB9;}