[Resolved] Colors of mobile responsive menu

[J.]

Hi there,

I’ve tried to search a solution for this, but it seems that the standard customizer does not support the settings I’m looking for. It’s about the menu-text in the header navigation. The color settings for desktop work fine but once you adjust the screen size to mobile, the text of the so-called hamburger menu is showing different colors. Please feel to check it out here, it’s a bit difficult to explain:

https://bit.ly/3r4PhW5

[David]

Hi there,

some of the Elementor theme styles are being applied to ALL buttons which is also affecting the menu toggle.

You can use some CSS to overwrite that:

/* Mobile menu button */
.mobile-menu-control-wrapper .menu-toggle {
  background-color: transparent;
  border-color: transparent;
  color: #000;
}
/* Hover color */
.mobile-menu-control-wrapper .menu-toggle:hover {
  background-color: transparent;
  border-color: transparent;
  color: #000;
}

Change the colors to suit

[J.]

Perfect, that works, thanks!

[David]

You’re welcome

[Author]

Posts