Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #797764

    I would like to Set Mobile Menu to browser width below 1024 instead of 990. Can you provide me with a way to accomplish this? Thanks!

    #797822

    Hey Beth,

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file: 

    @media only screen and (max-width: 1023px) {
    .responsive.html_mobile_menu_tablet .main_menu .avia-menu, 
    .responsive.html_mobile_menu_tablet #header_main .social_bookmarks, 
    .responsive.html_mobile_menu_tablet #header_main_alternate{display:none;}
    .responsive.html_mobile_menu_tablet .container #advanced_menu_toggle, .responsive.html_mobile_menu_tablet #advanced_menu_hide{display:block;}
    .responsive.html_mobile_menu_tablet.html_logo_right #advanced_menu_toggle{left:50px;}
    
    .responsive.html_mobile_menu_tablet #menu-item-shop {border-right: none !important;}
    }

    Please let us know if you need additional help.

    Best regards,
    Sarah

    #797879

    That didn’t work for me. I will input the URL and complete custom CSS I have added onto the site to ensure something else is not conflicting. I am checking it in Screenfly.

    #798079

    Hi,

    Please try this instead:

    @media only screen and (max-width: 1024px) {
    nav.main_menu {
      display:none !important;
    }
    #advanced_menu_toggle, #advanced_menu_hide {
      display:block !important;
    }
    }

    Best regards,
    Rikard

    #798293

    This also didn’t work. I am posting the quirktools.com for you to verify in private content.

    #798490

    Hi,

    You can try this:

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

    Best regards,
    John Torvik

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