[Resolved] Hamburguer background color square – New update issue

[David]

Hi GP Team!

In one of the last updates, all my websites designed with GP have generated a problem with the hamburger button. A different colored background appears and all three menu lines are white. Despite having the color settings well configured.

How can I solve it?

Thank you

PD – You can check the screenshot here.

[Leo]

Hi there,

Any chance you can link us to the site in question?

You can use the private information field.

Let me know 🙂

[David]

Hi Leo,

Of course. I can send you to different sites.

[David]

Hi there,

Elementors global color styles are being applied to all buttons…. which is a pain.
Overwrite them using this CSS:

.mobile-menu-control-wrapper .menu-toggle {
  background-color: transparent;
  color: #000;
}

[David]

Hi David,

I’ve tried it, but it doesn’t quite work. I pass you some screenshots for private.

It’s weird, because before starting a project with Elementor I always set the option to “deactivate element styles and inherit those from the template”

[Elvin]

Hi,

I’ve checked your site and found that the CSS you’ve added has missing } syntax which causes it not to work properly as shown here: https://share.getcloudapp.com/z8uP5m8e which causes this: https://share.getcloudapp.com/NQuJbl1q

Make sure it is added properly for it to work. 🙂

[David]

Hi Elvin,

You are right. I have fixed it, but now when the button is active the background appears black. I attach an image. I think we would just have to add “active” or similar in the CSS. But … you are the expert! 🙂

[Elvin]

We can add in .mobile-menu-control-wrapper .menu-toggle:focus & .mobile-menu-control-wrapper .menu-toggle:hover selectors.

It will look something like this:

.mobile-menu-control-wrapper .menu-toggle, .mobile-menu-control-wrapper .menu-toggle:focus, .mobile-menu-control-wrapper .menu-toggle:hover {
    background-color: transparent;
    color: #000;
}

[David]

Yeah! It works. Thank you so much Elvin.

Have a nice day 🙂

[Elvin]

No problem. 🙂

[Author]

Posts