How to change the color of the top menu buttons?

Hey,

Here is some CSS that should allow you to set the color of your active page menu item:

.current-menu-item {
    background: red !important;
}

Just change the “red” to whatever you like, and add the CSS to Theme Options> Advanced Settings.

Let me know if this works for you!

-Kevin

Thank you very much, Kevin!
And how do I change the color of the button when I move the mouse over it?

Try this:

.current-menu-item:hover {
background: #fff !important;
}

(I set it to white, but you may use any color)

:hover is the CSS you should use for items when you move the mouse over them.

Hope this helps!

Thanks, it worked! But I expressed myself badly, I want the buttons to change color even if I am not in the current page.

@daviadorna,
This css should work for you:

#nav-main ul.sf-menu a:hover {
    color: #333;
}

Hannah

Perfect! Thanks a lot!

Success

Where do I type this in at? Sorry Im very new to WP

Hi @johnstonashton,
Please always start a new topic and do not post in someone else’s.
Are you using Virtue theme? If so, you can a paste the above css into your custom css box in Theme Options > Advanced Settings. If you’re using a different theme you may need to use a plugin that outputs a custom css box.

Hannah