How can I split a mega menu into 2 columns on Prestige theme?

Hi, im currently working on Prestige theme, i have tried all the solutions in the forum but none seem to work, i have a Mega menu that i want to split into columns when reached 4 items,(for example “Ropa” i want it to be divided in two columns) as i want the menu to be as thin as possible.
this is the preview of the website https://qa06onjo8gcsils7-56255873209.shopifypreview.com

1 Like

Hi @haramara

Do you mean like this?

If it is, this is the code.

From your Shopify admin dashboard, click on “Online Store” and then “Themes”.

Find the theme that you want to edit and click on “Actions” and then “Edit code”.

In the “Assets” folder, click on “base.css, style.css or theme.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

#shopify-section-sections--22185078325559__header .mega-menu {
    height: fit-content;
    padding: 20px 0px;
}
.v-stack {
    grid-template-columns: 1fr 1fr;
}

And save.

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

not really,
what i want is just the submenu to divide into two columns when reached 4 rows,
For example ROPA in Hombres would have to be divided in two columns as it has reached 4 rows.
but the rest of them such as Shop By, Accessorios, and Brands would stay the same as they dont have more than 4 rows in the submenu, but if i add lets say 7 brands it would divide into two when reached 4 rows…
But i want the Main title to still be above not on the side