A user seeks to reduce the default 100% width of a mega-menu in the Turbo theme, which creates excessive white space between columns. They want the menu to be only as wide as necessary to fit the content and also wish to decrease padding between menu items.
Proposed Solutions:
Two support teams provided CSS-based approaches:
style.css file that sets the mega-menu width to 50% with a 25% left margin</head> tag in the theme’s liquid fileBoth solutions involve editing theme code files through the Shopify admin (Online Store → Theme → Edit code). The user confirmed interest in achieving a narrower, more compact menu layout as shown in a reference image. The discussion remains technical and solution-focused, with the user awaiting implementation results.
Hi, I just enabled my first mega-menu and by default, it’s using 100% of the screen, which leaves a ton of white space between columns. How would I reduce the width so it is only as wide as necessary to fit the text in each column?
Also, it would be great to reduce the padding between each menu item. Thanks!!!
I’m using the Turbo theme.
@KetanKumar that’s my desired solution, how do I accomplish this layout?
Also if it’s possible to reduce the top and bottom padding between the menu items, that would be amazing!
Hi [email removed]Eden73,
This is Victor from PageFly - Landing Page Builder App
You can try this code by following these steps:
Step 1: Go to Online Store->Theme->Edit code.
Step 2: Search file style.css.
Step 3: Paste the below code at bottom of the file → Save
[data-nav-desktop-details][open] .nav-desktop__tier-2–full-width-menu {
width: 50% !important;
margin-left: 25%;
}
Hope my solution works perfectly for you!
Best regards,
Victor | PageFly
Hello @kittycatmeowmy ,
It’s GemPages support team and glad to support you today.
I would like to give you the recommendation to support you so kindly follow the steps below:
Open your theme.liquid theme file
Paste the below code before
For example,
If you require any further information, feel free to contact me.
Best regards,
GemPages Support Team
