Hamburguer Menu - On Desktop

Hello guys.

So, looking for the use of the Hamburguer menu on desktop version, I’ve found this topic:

But, when aplied to my site, whenever I click on the Hamburguer, the site looses the browser scrollbar and nothing is shown.

What can I do?

http://immunitavacinas.com.br/

(the CSS code from the topic is not aplied right now)

Hello there,

To help us inspect and troubleshoot, keep the custom code remains. Please re-add it and let us know once you’re done. Ensure this code added:

    .main-navigation {
      z-index: 9999 !important;
    }

Regards,
Kharis

Uploaded with the code.

http://immunitavacinas.com.br/

Tks.

Hello there,

Try adding this CSS code to Appearance > Customize > Additional CSS from dashboard.

    @media only screen and (min-width: 1200px) {
      .mobile-menu-active .main-navigation {
        display: block;
        opacity: 1;
        visibility: visible;
        pointer-events: initial;
        -webkit-transform: scale(1);
                transform: scale(1);
        -webkit-transition: opacity .2s 0s ease, visibility 0s 0s linear, -webkit-transform 0.2s 0s ease;
        transition: opacity .2s 0s ease, visibility 0s 0s linear, -webkit-transform 0.2s 0s ease;
        transition: transform 0.2s 0s ease, opacity .2s 0s ease, visibility 0s 0s linear;
        transition: transform 0.2s 0s ease, opacity .2s 0s ease, visibility 0s 0s linear, -webkit-transform 0.2s 0s ease;
        z-index: 9999 !important;
      }  
    }

Regards,
Kharis

Tried, problem not solved.

:frowning:

Hello there,

Try replacing the code I suggested before with this one:

    @media only screen and (min-width: 1200px) {
      .mobile-menu-active .main-navigation {
        position: absolute;
        display: block;
        opacity: 1;
        visibility: visible;
        pointer-events: initial;
        -webkit-transform: scale(1);
                transform: scale(1);
        -webkit-transition: opacity .2s 0s ease, visibility 0s 0s linear, -webkit-transform 0.2s 0s ease;
        transition: opacity .2s 0s ease, visibility 0s 0s linear, -webkit-transform 0.2s 0s ease;
        transition: transform 0.2s 0s ease, opacity .2s 0s ease, visibility 0s 0s linear;
        transition: transform 0.2s 0s ease, opacity .2s 0s ease, visibility 0s 0s linear, -webkit-transform 0.2s 0s ease;
        z-index: 9999 !important;
        background-color: #13151d !important;
      }  
    }

Regards,
Kharis

Hi, i tried to apply this to my airi based website but it didn’t work. Is this solved? I also want to keep de hamburguer menu on desktop and i don’t know how.