Mobile menu doesn’t stick

Hi @pikselprfekt,

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

.sticky-active .mobile-header {
  position: sticky;
  top: 0;
  background-color: #2b3741 !important;
}

That did not help unfortunately.

Thank you for getting back, @pikselprfekt!

I can’t troubleshoot the suggested CSS code above because I don’t see the code applied onto your site. If you intentionally put if off, please put it back, then let me know once you have done so.

Sorry, I had to put this project on the back burner. I’ve implemented the code and left it in.

I just had the same problem and css did not help…
mobile header only gets sticky again, if you change main-header settings type back to “always keep on top”…

I’m still struggling with this…

Hi @pikselprfekt,

Sorry for the delay in response.

Upon checking your site’s source code, I saw your custom CSS contains an error.

/*Hamburger menu closing code*/

(function($) {
    'use strict';

    if ( matchMedia( 'only screen and (max-width: 1024px)' ).matches ) {
        $('.menu li a').on('click', function(){
            $('.sydney-offcanvas-menu').removeClass('toggled');

        });
    }

})(jQuery);

/*Hamburger Menu Slide*/

.sticky-active .mobile-header {
  position: sticky;
  top: 0;
  background-color: #2b3741 !important;
}	

Please remove this part as it is not CSS code.

/*Hamburger menu closing code*/

(function($) {
    'use strict';

    if ( matchMedia( 'only screen and (max-width: 1024px)' ).matches ) {
        $('.menu li a').on('click', function(){
            $('.sydney-offcanvas-menu').removeClass('toggled');

        });
    }

})(jQuery);

It is jQuery code. You would add it to your site with additional custom jQuery inserter plugin instead.