Archived topic
Change sub sub and sub sub sub menu colors
7 replies · Started by Gelu-Dănuț on April 15, 2022
For my website https://www.vreauportadoors.ro i want to change colors in sub-sub menu and sub-sub-sub menu.
Thank you!
Hi Gelu,
Kindly try adding this in Appearance > Customize > Additional CSS:
div#primary-menu ul.menu > li > ul.sub-menu > li > a {
background-color:rgb(255,0,0);
color:rgb(255,255,255);
}
div#primary-menu ul.menu > li > ul.sub-menu > li > ul.sub-menu > li > a {
background-color:rgb(0,255,0);
color:rgb(0,0,0);
}
Kindly change the color values to your preference: https://htmlcolorcodes.com/color-picker/
Hope this helps! Kindly let us know how it goes. :)
Thank you. Is it possible to change the colors for hover color and current color?
Try this for hover and current.
div#primary-menu ul.menu > li > ul.sub-menu > li:hover > a,
div#primary-menu ul.menu > li > ul.sub-menu > li.current-menu-item > a {
background-color:rgb(255,0,0);
color:rgb(255,255,255);
}
div#primary-menu ul.menu > li > ul.sub-menu > li > ul.sub-menu > li:hover > a,
div#primary-menu ul.menu > li > ul.sub-menu > li > ul.sub-menu > li.current-menu-item > a {
background-color:rgb(0,255,0);
color:rgb(0,0,0);
}
Thank you!
You're welcome
I don't think I managed to make them different, especially in the case of the mobile menu. :(
OK - lets backtrack.
Remove any of the CSS provided in this topic.
Then go to Customizer > Colors --> Primary Navigation and there you will see:
Sub-Menu Background
Sub-Menu Text
You can change the colors there.