Split dropdown sub menu in multiple columns (Trade Theme )

[SaqlainShah]

Hi there,

Hope someone can help me out and thank you so much in advance.

I am using Trade theme.
My sub menu has a drop down list of collections I would like to have them split into 2 or 3 columns to make is user friendly. I have tried my best using css codes and some setting options but no use.

Your help would be much appreciated.

Once again Thank you..!!

[Entesta]

Hi @SaqlainShah 

You can create multiple columns as per your requirements using CSS Flexbox. Add the following CSS to the end of your assets -> base.css file.

.mega-menu__list.page-width.mega-menu__list--condensed {
  column-count: 3;
  column-gap: 20px;
}

 


Thanks.

[Entesta]

@SaqlainShah you can adjust the column-count as per your requirement.

[SaqlainShah]

Hi @Entesta 

Thank you for your response

It worked partially i was able to split in columns as required but the list that has text/collection names are broken down and coming up vertically instead of horizontal

[Entesta]

@SaqlainShah kindly share your website link. It will help us to debug it faster.
Thanks.