Mobile menù covers the entire screen. How can i solve it?

Vick2 · ‎09-24-2023

Since i had my theme upgraded to 11.0 a lot of things changed. Before the menù didnt cover the entire screen but only a section and i want it back that way. Can you help me?

BEFORE (How i want it):

Immagine 2023-09-24 112709.png

AFTER (I dont want it like this):

Immagine 2023-09-24 111513.png

Natasha-Saed · ‎09-24-2023

1) Go to online store
2) Edit Code
3) Open your base.css file
4) Paste the following code

.menu-drawer {width: 85% !important;}

You can adjust the size from here to the exact look you want 100% full cover.

5) Save.

Let me know if it work by marking it as a solution.

If my solution helped you don't forget to accept it to help others.
===================================================================
And if you really like my support share a cup of coffee with me paypal.me/freemindsint

View solution in original post

Natasha-Saed · ‎09-24-2023

Hi again,

I need your store URL to be able to solve this to you.

If my solution helped you don't forget to accept it to help others.
===================================================================
And if you really like my support share a cup of coffee with me paypal.me/freemindsint

Vick2 · ‎09-24-2023

www.easeastore.com

Natasha-Saed · ‎09-24-2023

1) Go to online store
2) Edit Code
3) Open your base.css file
4) Paste the following code

.menu-drawer {width: 85% !important;}

You can adjust the size from here to the exact look you want 100% full cover.

5) Save.

Let me know if it work by marking it as a solution.

If my solution helped you don't forget to accept it to help others.
===================================================================
And if you really like my support share a cup of coffee with me paypal.me/freemindsint

Natasha-Saed · ‎09-24-2023

If my solution helped you don't forget to accept it to help others.
===================================================================
And if you really like my support share a cup of coffee with me paypal.me/freemindsint

Sweet_Savior_3 · ‎09-24-2023

@Vick2

Paste the given style in 'Assets > base.css'

.menu-drawer {
    max-width: calc(100% - 50px);
}

Don't forget to like and accept the solution.

Thanks

Don't forget to like and accept the solution to help others store owners.
Looking for an expert or Have any queries ? Send query to the Inbox
Coffee Tip ? Pay to shopify.dev.34@gmail.com
From Less To Further !!!

PageFly-Richard · ‎09-24-2023

Hi @Vick2

This is Richard from PageFly - Shopify Page Builder App, I’d like to suggest this idea:
Online Store ->Theme ->Edit code
Assets ->Base.css

.menu-drawer {
   width: 100% !important;
}

Hope you find my answer helpful!
Best regards,
Richard | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!

➜ Optimize your Shopify store with PageFly Page Builder (Free plan available)

All features are available from Free plan. Live Chat Support is available 24/7.

Mobile menù covers the entire screen. How can i solve it?

Mobile menù covers the entire screen. How can i solve it?

Community Blog Articles