Site logo

Archived topic

Change background color of hamburger & dropdown menu on menu

5 replies · Started by Jon on October 9, 2022

Viewing posts 1–6 of 6

Hi - the hamburger & the related dropdown menu on my site has a light grey background color which I would like to change to white to match the rest of the site. I can't find the settings for them under Colors in Customizer and neither can I work out the right CSS selectors.

Could you explain how I change it please?

Hi there,

try this CSS:


.has-inline-mobile-toggle #site-navigation.toggled {
    background-color: #fff;
}

Hi David - thanks. That works for the mobile dropdown menu (see live site), but not for the hamburger background. I think I've worked it out with this:

/* change background color on hamburger and menu dropdown on mobile */
.has-inline-mobile-toggle #site-navigation.toggled {
    background-color: #fff;
}
.mobile-menu-control-wrapper .menu-toggle, .mobile-menu-control-wrapper .menu-toggle:hover, .mobile-menu-control-wrapper .menu-toggle:focus, .has-inline-mobile-toggle #site-navigation.toggled  {
	 background-color: #fff;
}

Does that look right to you?

Great, thank you.

You're welcome Jon!

This archived topic is closed to new replies.