I have a nav menu call:

'primary', 'container_class' => 'primary-menu' ) ); ?>

The output looks something like this:

<div class="primary-menu"><ul id="menu-other-links" class="menu">
<li id="menu-item-51" class="menu-item menu-item-type-custom"><a href="#">RSS</a></li>
<li id="menu-item-49" class="menu-item menu-item-type-post_type"><a href="http://localhost:8888/graca/contacto/">Contacto</a></li>
<li id="menu-item-52" class="menu-item menu-item-type-custom"><a href="#">Facebook</a></li>
<li id="menu-item-53" class="menu-item menu-item-type-custom"><a href="#">Twitter</a></li>
<li id="menu-item-56" class="menu-item menu-item-type-post_type"><a href="#">Site Info</a></li>

I'm trying to apply a different background color to each menu item, so #1 would get one color, #2 a second color.

I would like the theme work for whatever menu items someone wants to set up- so it would be preferable it the #id on each li went in order.


<li id="item1">List item</li>
<li id="item2">List item</li>
<li id="item3">List item</li>
<li id="item4">List item</li>

Any help would be appreciated.

  • do you want to reorder the li items id's? Commented Oct 27, 2012 at 9:18
  • Thats what would happen if he meddled with the IDs as he wants, he's looking for a fix to his problem, he's looking for a fix for a fix for a fix for his problem
    – Tom J Nowell
    Commented Nov 29, 2012 at 12:20

3 Answers 3


If you can stand to not have it be backwards compatible, CSS3 introduced the nth-child selector, you could leverage that


check out http://codex.wordpress.org/Function_Reference/wp_nav_menu and look for the items_wrap part


Go to WP-admin -> Appearance -> Menus -> Screen options (top right) -> Check CSS Classes -> Open menu item and put your custom class you want and prepare style for it.

The best and easiest way to create custom CSS for each element in menu.

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.