Custom menu item hover color

  • Author
  • #575807


    My site is here:

    I added a custom link to my menu called “Home.” At first, it displayed as white (on my white background) so it didn’t show up. I figured out how to fix that, but now when you hover over it, it doesn’t change to white, as the other menu items do, it remains the same gray color on the green background of the hover. I can’t figure out how to edit the CSS to make it display as white (#ffffff) when it’s hovered over. I do have the CSS upgrade, FYI.

    Any help?

    The blog I need help with is


    This will take care of it for you.

    #access ul li.current_page_item > a:hover {
    color: #FFFFFF;


    It’s not specific to that individual link, the colour declaration is missing for the link to the current page regardless of which page you are on. Here’s the code to add to fix it:

    #access ul li.current_page_item:hover > a, #access ul li.current-menu-item:hover > a {color:#fff;}



    Worked like a charm! Thank you both for this and for all your help in the forums. I’m new at this, and couldn’t have gotten this far without all the stuff I’ve found from both of you in the forums. Cheers!

The topic ‘Custom menu item hover color’ is closed to new replies.