[Support request] changing hover color of just one specific navigatin menu item?

[Franz]

Hi,

I’d love to change the hover background color for one specific navigation menu item while keeping the default/standard color for all other items. Is there a way to do this? I have defined a special CSS class for this menu item in WordPress’ menu setup, but have no idea how to address the hover background color through this class.

Thanks and kind regard
Franz

[Fernando]

Hi Franz,

Can you kindly provide the link to the site in question, and a screenshot or description of the menu item you wish to alter?

You may use the private information field if your prefer: https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information

Hope to hear from you soon. 🙂

[Franz]

it’s cruisetricks.de and you’ll see the relevant menu item in the screenshot, marked red. I’m actually using this menu item as a workaround to put a link on an image that overlaps the navigation 😉 It works well this way so I’d like to keep it like it is but get rid of the hover effect, obviously.

[Fernando]

I understand. Here is a CSS you may try:

#primary-menu .fnespacer:hover > a {
    background-color:transparent;
}

You may replace transparent with a specific color for instance rgba(0,0,0,0.5): https://rgbacolorpicker.com/

Here is an article with regards to adding CSS: https://docs.generatepress.com/article/adding-css/#additional-css

Adding it through additional CSS should work.

Hope this helps! Kindly let us know how it goes. 🙂

[Franz]

Works perfectly well, thanks a lot! 🙂

Kind regards
Franz

[Fernando]

You’re welcome Franz! Glad to be of assistance! Feel free to reach out anytime if you’ll need assistance with anything else. Kind regards. 🙂

[Author]

Posts