I would like to expand only the active part of the sidebar menu and hide the parts which have nothing to do with the actual selection. Just like how its done on every Explorer like file manager, or how it is with accordion menus.

In the default TwentyTen theme, this is the class definition for the active submenu:

menu-item menu-item-type-post_type menu-item-object-page current-menu-ancestor current-menu-parent current_page_parent current_page_ancestor

and this is the one for a non-active submenu:

menu-item menu-item-type-post_type menu-item-object-page

So I'm thinking about using something like:

li .menu-item ul .sub-menu { display: none; }
li .current-menu-parent ul .sub-menu { display: inherit; }

Would something like this work? It must be a fairly common problem, but I have not found a single solution with Google.

To have an idea why it’s important to make the menu smaller, here is the site I'm working on where the menu is overly complicated: http://kek.org.hu/kozossegikertek

2 Answers 2


I use just such a menu in my Oenology Theme. Feel free to use the sidebar menu CSS to suit your needs! Rather than try to post it all here, I'll just link to the Oenology GitHub repository.


Here's where the sidebar navigation menu style definitions start.

  • Thanks, I solved my specific case with just two lines in CSS, as I only had a two level menu. But I run into a CSS issue, can you have a look at it? stackoverflow.com/questions/5851738/…
    – hyperknot
    May 1, 2011 at 22:03
  • I just stopped by your other question. Looks like you got it sorted out! May 2, 2011 at 0:32

Based on Chip Bennett's answer here is the solution I ended up using. I recommend it for someone looking for how to hide a sub-menu of a two-level menu:

.widget_nav_menu li.menu-item ul.sub-menu {
    display: none;

.widget_nav_menu li.current-menu-item ul.sub-menu ,
.widget_nav_menu li.current-menu-ancestor ul.sub-menu {
    display: inherit;
  • Would you mind explaining further where this is supposed to be placed, for CSS dummies? (when placed in the blocco style.css file, in several spots, it didn't seem to hide the sub-menu as expected: press75.com/themes/blocco-theme-demo ) Thanks!
    – user11039
    Dec 12, 2011 at 1:55

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.