hamburgerpants Posted April 8, 2021 Share Posted April 8, 2021 Site URL: https://www.digitallocations.com/ Hi! When I reduce my browser window down to a tablet size, the navigation menu stacks into 2 rows like in my attached screen shot, how can I force it to go to the mobile menu at that width? Link to comment
tuanphan Posted April 10, 2021 Share Posted April 10, 2021 You can add this to Design > Custom CSS. Change 1050 to screen size where nav start breaking to 2 lines /* Burger menu */ @media screen and (min-width:768px) and (max-width:1050px) { /* hide navigation */ .header-nav { display: none; } /* Hide header button */ .header-actions { display: none; } /* show burger */ .header-burger { display: flex; } /* Show overlay mobile menu */ .header--menu-open .header-menu { opacity: 1; visibility: visible; } } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
Recommended Posts
Archived
This topic is now archived and is closed to further replies.