How can I change my drop menu to a list style on Meenooo.com?

Store Design

Topic summary

A user seeks to convert their website’s wide column dropdown menu into a list-style format.

Solution Provided:

  • Navigate to: Admin → Online Store → Themes → Edit Code
  • Open the theme.scss file in the Assets folder
  • Add custom CSS code at the end of the file

CSS Modifications:
The code targets .site-nav__dropdown.megamenu and related grid elements to:

  • Adjust width properties to max-content
  • Set display to flex
  • Modify positioning to relative

Outcome:
The solution was successfully implemented and confirmed working by the original poster.

Summarized with AI on November 19. AI used: claude-sonnet-4-5-20250929.
1

https://meenooo.com

in this site i want drop menu to be a list not a very wide column

1 Like
2

Hi @abdo10

You can follow the instructions to achieve the result below.

  1. From you Admin page, go to Online store > Themes > Click the three dots on the theme you want to edit > Edit code
  2. Go to Asset folder and open the thtme.scss file
  3. At very end of the code, add the code below
.site-nav__dropdown.megamenu.text-left {
    min-width: max-content;
}

li.site-nav__item.site-nav__expanded-item.site-nav--has-dropdown.site-nav--is-megamenu {
    position: relative;
}

.grid.grid--center {
    display: flex;
}

.grid.grid--center > * {
    width: max-content;
}

Result:

made4Uo_0-1686247621465.png
made4Uo_0-1686247621465.png1888×758 262 KB

1 Like
3

thanks a lot

it works