How to hide main menu while showing sub-menu in css


Tags: css,wordpress

Problem :

I'm creating a side-bar menu for a site, which should only show sub-menus in a currently selected page. The site is in wordpress. I have managed to hide inactive sub-menu items for pages that are not selected using this css:

    .sub-menu { display: none; }
    .current_page_item .sub-menu, .current_page_parent .sub-menu { display: block;}

But how can I hide the main menu items but still display their sub-menus? Here's a link to the site NOTE: I want to hide ALL the main menu items so that I only have the sub-menus

Help would be much appreciated!



Solution :

This will hide the current item anchor.

.current_page_item > a {display:none;}

(You may want to adjust the left margin on the sub items depending on the look you're going for.)


    CSS Howto..

    How to add a custom CSS file in ExtJs 5?

    How can I make an only active on mobile devices?

    How can I place three block of contents in one line in a way that the middle block is always full width?

    How do sprites work in jqmobile?

    How can i find and change css style in ruby?

    CSS - How to crop an image to a square, if it's already square then resize it

    CSS how to height step arrow

    CSS Firefox - How to deactivate the dotted border ( firefox click indicator )?

    CSS check box, how to make an item unchecked only if another one is checked

    Is not showing anything, or showing “undefined”

    How do I increase the size of the text contained?

    How to zoom into a specific location of an image using CSS

    How to apply an opacity without affecting a child element with html/css?

    How did Google make these 3d buttons? [closed]

    How to correctly impose a background-color to a div wrapping article and aside in HTML/CSS?

    How to apply css to link in dropdown table using arrow keys and hover event?

    CSS selectors: how to make element hovering change wrapper's style

    How to style form elements unobtrusively with JavaScript and CSS?

    How to replace a Font Awesome icon within link text with a different icon on link click?

    CSS how to change color of a specific primary-panel in a if-block

    How to Add Another Instance of Date picker in given Code

    How to return WebElement having particular CSS property using JavascriptExecutor?

    How to scroll an html element both horizontally and vertically with top and side labels scrolling correctly

    .show() not working on page load

    How do I use css to make a row of boxes that do not wrap when browser shrinks?

    How to add css styles on aria-hidden attribute

    How to toggle the sidebar menu for every browser size?

    Google fonts and twitter bootstrap 3: where should I load the fonts, and how to use it in css file?

    how to change width of without affecting width

    How do i include font awesome classes in my css file?