Viewing 5 replies - 1 through 5 (of 5 total)
  • In general, you can use the menu-id class or id to target a specific menu item – look in the HTML using a browser too like Firebug to see what that is.

    For more specific help, we need to see your site.

    Thread Starter VictoriaSunrise

    (@victoriasunrise)

    This is the site: http://phadis.ro/

    First take this out or fix it – as is, it’s invalid CSS:

    .menu .current_page_item a,
    .menu .current-menu-item a {05be00
    	background-color: #;

    Make sure the syntax is correct – it should be:

    .menu .current_page_item a,
    .menu .current-menu-item a {
    	background-color: #05be00;
    }

    To make the buttons different colors per menu item, look at the HTML – for the first one it’s:

    <li id="menu-item-191" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-191">
    <a href="http://phadis.ro/patients/">Patients</a>

    So then the CSS would be:

    li#menu-item-191 a {
       background-color: red;
    }

    Thread Starter VictoriaSunrise

    (@victoriasunrise)

    Thank you for your answer!
    I change the button colors, but there is a little problem, the color should appear when the buttons are active, but now they look like they are all active. How can i fix that?
    There should be a connection between this one:

    .menu .current_page_item a,
    .menu .current-menu-item a {
    	background-color: #05be00;
    }

    and this one

    li#menu-item-155 a {
       background-color: #05be00;
    }
    Thread Starter VictoriaSunrise

    (@victoriasunrise)

    I understood how to change the CSS. WPyogi thanks a lot for your help!
    This is the final code.

    li#menu-item-155.current-menu-item a {
       background-color: #05be00;
    }

    Have a great day!

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Change background color for each main menu button’ is closed to new replies.