[itsamiro]

What’s the best way to change the menu background color when you hover over submenu items? It’s not in the custom color option, and I’ve tried editing the CSS, but I’m missing something.

Here’s the url: madfanatics.com – current default color is set to #444

Thanks!

[Pratik]

Hi @itsamori,

I have forwarded the ticket to our CSS expert. He will reply to you soon.

Regards,
Pratik

[Mahesh]

@itsamiro: Please use the following CSS:

.nav-primary .menu .sub-menu a:hover, 
.nav-primary .menu .sub-menu a:focus, 
.nav-primary .menu .children a:hover, 
.nav-primary .menu .children a:focus {
    background-color: #ff00ff;
}

Note: Use the color as desired.

Regards,
Mahesh

[itsamiro]

Hi @mahesh – I’m not sure what I’m doing incorrectly. I added the CSS both in the style sheet, as well as the CSS field in the theme customization option in wordpress, and it’s not having the desired affect.

I did change the color hex code as well.

Can you take a look? madfanatics.com

[Mahesh]

@itsamiro: You’ve some CSS as below somewhere in you Custom CSS:

.nav-primary .menu a { background-color: #000000; color: #ffffff; }
.nav-primary .menu li a:hover, .nav-primary .menu li a:focus, .nav-primary .menu li:hover > a, .nav-primary .menu li:focus > a, .nav-primary .menu .current-menu-item > a, .nav-primary .menu .current-menu-ancestor > a, .nav-primary .menu .current_page_item > a, .nav-primary .menu .current_page_ancestor > a { background-color: #000000; color: #0087b5; }
.nav-primary .menu .sub-menu a, .nav-primary .menu .children a { background-color: #000000; color: #ffffff; }
.nav-primary .menu .sub-menu a:hover, .nav-primary .menu .sub-menu a:focus, .nav-primary .menu .children a:hover, .nav-primary .menu .children a:focus { background-color: #444444; color: #e8554e; }

Please remove this. Or use !important in the above like this.

.nav-primary .menu .sub-menu a:hover, 
.nav-primary .menu .sub-menu a:focus, 
.nav-primary .menu .children a:hover, 
.nav-primary .menu .children a:focus {
   background-color: #fff !important;
}

Regards,
Mahesh

[Author]

Posts