The question is answered, right answer was accepted
Mercer : How to reduce the size of the main navigation hamburger menu ?
After I click the hamburger menu it opens up and covers the entire page. I'm looking to make this smaller. Ideal size would be wherever the contents of the menu end.
@ruchitkapoor: The hamburger menu is designed for mobile, where you'd want it to cover the page. If you want to customise yours for desktop, you'll want to provide us with a link to it.
@Paul2009 :- Thanks for your prompt response Paul. my website's url is www.thepinkchampa.com.
Answer by Paul2009 · Jan 14, 2017 at 11:12 AM
There are some amazing cushions on this site!
To make the menu smaller on desktop computers, try adding this to Design > Custom CSS. You can adjust the width (344 pixels) to suit your needs.
@media screen and (max-device-width: 640px) {
.Mobile-overlay-menu {
width: 344px;
}
}
I hope that helps you.
Paul
To everyone! If you find this (or any) answer helpful, please vote it up using the up arrow. This will let other users know it's a good answer.
@Paul2009 Hell yeah, it worked ! Thanks a tonne Paul. and thank you for the compliment on the cushions. I'm the Photographer and designing this website for my client.
You're welcome. They certainly look great in the photos. It's a great use of the image-change-on-hover on the products page.
Hello! I have attempted this using the above code -- and am getting no results. What am I doing wrong?
Thanks in advance, Chelsea
If you're using it with Mercer, please provide a site URL.
Hi Paul,
Thanks — bighq.ca
Currently have the mobile breakpoint set to 800 px. Would like to set it so the hamburger icon is always active - on desktop... however... I need to adjust the size of the open menu so it does not cover the entire page.
@paul2009 Sorry Paul! I removed it... was adding something else and took it out... It's there now.
@paul2009 Sorry Paul! I removed it... was adding something else and took it out... It's there now.
OK, try this for your site instead of the answer above:
.Mobile-overlay {
width: 344px;
}
You are AMAZING!!! Thank you. Thank you. !!
Established 2003 Squarespace Handmade in NYC
Powered by AnswerHub