WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

If I want to apply a style to only an item in a menu that has a submenu, how can I select that with CSS?

share|improve this question
up vote 1 down vote accepted

You could use jQuery, if you're open to a jQuery solution?

<script type="text/javascript">  
jQuery(document).ready( function($) {
    $('#your_menu_id li').has('ul').addClass('has_children');

Slight modification of what i posted here basically.

Any menu item with a submenu will then have a has_children class you can target in the stylesheet..

#your_menu_id li.has_children { /* your styling */ }
#your_menu_id li.has_children ul { /* your styling */ }
#your_menu_id li.has_children ul li { /* your styling */ }

Hope that helps..

share|improve this answer

Go to my menu area in admin, click the “Screen Options” link at the top, and check the “CSS Classes” then on each menu I’ll have an area I can define my css class for that menu item. enter image description here enter image description here

share|improve this answer
This is a good solution if your pages aren't changing, but I'm dealing with users who are changing pages and won't remember to add the CSS class. – GavinR Apr 19 '11 at 0:38
Yeah its for the less advanced users. – Bainternet Apr 19 '11 at 9:10

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

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