Menu hover color.

  • Unknown's avatar
    petrateslerova · Member ·

    I want to change the color of the box that appears then I hover over the menu items. It is very dark black and too much of a contrast to the rest of the page. When I try and take out the black it changes other parts of the site, but not the hover.

    The blog I need help with is: (visible only to logged in users)

  • kathrynwp · Staff ·

    Hi there, you can try adding this code under Appearance > Custom Design. Click the CSS tab and add this completely below the existing green comments:

    .nav-menu li:hover > a,
.nav-menu li a:hover {
	background-color: #220e10 !important;
}

    Change 220e10 to the hex colour you’d like to use instead of the dark one.

    If you think you might have sub-menu items at some point and want their background colours to match, you can use this code instead to include the sub-menu items: 

    .nav-menu li:hover > a,
.nav-menu li a:hover,
.nav-menu .sub-menu,
.nav-menu .children {
	background-color: #220e10 !important;
}

    Click Save when you’re done.

    If you need further CSS help, please feel free to post in our CSS Customization forum.

  • The topic ‘Menu hover color.’ is closed to new replies.