Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #1017356

    I had CSS in place that allowed a sticky mobile menu and scrolling on mobile. Now it suddenly stopped working and I can’t find why. Can you help me get the mobile menu sticky again—so we can scroll in mobile without scrolling the menu too?

    Here is the CSS that’s been working:

    ____________________________________________________________________

    /* —- KEEP MOBILE MENU VISIBLE SCROLL —- */

    #advanced_menu_toggle, #advanced_menu_hide {
    position: fixed !important;
    right: 3% !important;
    top: 5% !important;
    }

    @media only screen and (max-width: 1200px) {
    #wrap_all {overflow: hidden !important; /*needed for mobile menu scrolling */}
    }

    @media only screen and (max-width:1200px; min-width: 768px) {
    .responsive #top #wrap_all #header {
    position: fixed !important;
    }
    .responsive #top #main {
    padding-top: 80px !important;
    }
    }

    @media only screen and (max-width: 1200px) {
    #top #menu-item-search {
    display: none;
    }
    }

    @media only screen and (max-width: 1200px) {
    .main_menu{ right: -5px !important;}
    }

    /* —- END KEEP MOBILE MENU VISIBLE SCROLL —- */

    Here is the mobile breakpoint CSS:

    _______________________________________________________

    /* —- MOBILE MENU BREAKPOINT —- */

    @media only screen and (max-width: 1200px; min-width: 768px) {
    .html_mobile_menu_tablet .main_menu , .html_mobile_menu_tablet #header_main_alternate{display:none !important;}
    .html_mobile_menu_tablet .container #advanced_menu_toggle, .html_mobile_menu_tablet #advanced_menu_hide{display:block !important;}
    .html_mobile_menu_tablet #mobile-advanced{display:block !important;}
    }

    /* —- SIDEBAR MOBILE BREAKPOINT —- */

    @media only screen and (max-width: 989px) {
    .responsive #top .container .av-content-small, .responsive #top #wrap_all .flex_column, .responsive #top #wrap_all .av-flex-cells .no_margin {
    margin: 0;
    margin-bottom: 20px;
    width: 100%;
    }
    .responsive .content{
    border:none;
    }
    }

    /* —- FIREFOX SIDEBAR MOBILE BREAKPOINT —- */

    @media only screen and (max-width: 989px) {
    .responsive .sidebar{
    clear: both !important;
    }
    }

    /* —- END SIDEBAR MOBILE BREAKPOINT —- */

    /* —- END MOBILE MENU BREAKPOINT —- */

    #1017591

    I was able to restore the CSS settings. No need to follow-up.

    Thanks.

    — Michael

    #1017666

    Hi Michael,

    Great, glad you got it working and thanks for the update. Please let us know if you should need any further help on the topic or if we can close it.

    Best regards,
    Rikard

Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.