Solved

How can I fix the menu cut-off issue in my mobile layout?

Hippada
Tourist
4 0 0

My mobile layout drop down menu has too much padding and the account & language selection tab aren’t visible (see picture). I reduced the width but can’t find a solution for length. Greatly appreciate some help.

IMG_2123.png

Accepted Solution (1)

Dan-From-Ryviu
Shopify Partner
7726 1506 1514

This is an accepted solution.

Hi @Hippada 

Please add this code below to theme.liquid file, after <head> element in Online Store > Themes > Edit code 

<style>
@media (max-width: 749px) {
.js .menu-drawer { height: calc(var(--viewport-height, 100vh) - 110px) !important; }
}
</style>

Best Regards,

Dan

 

- Helpful? Like and Accept solution or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

View solution in original post

Replies 2 (2)

Dan-From-Ryviu
Shopify Partner
7726 1506 1514

This is an accepted solution.

Hi @Hippada 

Please add this code below to theme.liquid file, after <head> element in Online Store > Themes > Edit code 

<style>
@media (max-width: 749px) {
.js .menu-drawer { height: calc(var(--viewport-height, 100vh) - 110px) !important; }
}
</style>

Best Regards,

Dan

 

- Helpful? Like and Accept solution or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

Hippada
Tourist
4 0 0

Dan, 

 

Thank you very much and it was a perfect fix! Appreciated the simple explanation as well!