How to style each list item background of the wordpress navigation separately -


so i'm working standard wordpress navigation , need change background of each menu item when link inside list item active.

.current-menu-item trick list items problem have same styling each element.

for instance:

<nav>     <div>         <ul>             <li>               <a href="index.html">home</a>             </li>             <li>               <a href="portfolio.html">portfolio</a>             </li>         </ul>     </div> </nav> 

does have experience this?

i tried using pages like: http://codex.wordpress.org/function_reference/wp_nav_menu without result unfortunately..

also using child selectors didn't work..

it sounds want different active states each individual link. .current-menu-item captures active link, doesn't offer customization each individual link.

i think can use combination of nth-child , .current-menu-item. know .current-menu-item gets applied? if it's on <li>, should work:

nav li:nth-child(1).current-menu-item {     background-color: red; } nav li:nth-child(2).current-menu-item {     background-color: blue; } nav li:nth-child(3).current-menu-item {     background-color: green; } 

see in fiddle: http://jsfiddle.net/dz32r/


Comments

Popular posts from this blog

database - VFP Grid + SQL server 2008 - grid not showing correctly -

jquery - Set jPicker field to empty value -

.htaccess - htaccess convert request to clean url and add slash at the end of the url -