Modify text color for hover in main menu for Travelify theme

I’m working with a child theme based on the Travelify as parent theme in a networked instance of wordpress. The simple thing I would like change is the color of the main menu item text while hover. I tried several modifications on the css file of the parent theme and on the child theme. I also tried “Design -> Theme Option -> Custom CSS” with no success. It seems like the CSS changes have totally no effect on the rendering of the web page. The code I used is as follows:

#main-nav li:hover > a, #main-nav ul ul :hover > a, #main-nav a:focus {
  color: #fff;

Can anybody please give me a hint? Why does the theme not support to change the menus hover text color by itself? The hover background can easily be changed directly while using the “Edit Theme” menu.

Thanks Lars

Set to !important and you are good to go. Here is an example:

#main-nav li:hover > a, #main-nav ul ul :hover > a, #main-nav a:focus {
  color: #f !important;

Let me know if this works for you.

Thank you so much. It worked perfectly!

I am having problems with this as well. I have placed your coding in the CSS advanced but it didn’t change it. When I click on the text in the menu bar (which is white), the hover is still green.

I am not technical but it looks like the hover border on text is #439f55 which is green and the hover background is #57ad68 which is also green. So both of these need to be changed???


This thread is rather old and is marked as resolved. Therefore please start your own thread and we will help you from there.

Sorry for inconvenience.