How can I adjust column width for one-line text in a mega menu?

Hi! Maybe someone can help me regarding this?

I have created a mega menu with images, two columns of links, but can not find where to change the width of each column so the text fits in one line. Here is an example:

My current shop theme is VANTAGE.

Thanks in advance!

1 Like

Hi @LizelStudio ,

Could you please share your store URL, so that I can help you

Hey @LizelStudio

Could you please provide your Store URL and, if applicable, the Password too? Your cooperation is greatly appreciated!

Best Regards,
Moeed

Could you share your store URL to check?

Sure, here it is:

https://kf2fctudxo9jmhyo-51456868517.shopifypreview.com/#

Thanks!

Hi @LizelStudio

Please add this CSS code at the bottom of your stylesheet.css or stylesheet.css.liquid file in your Online store > Theme > Edit code > Assets

#menu-wrapper .inside-wrapper { width: auto !important; }

Hi @Beae_Cass !

Here is the shop link:

https://kf2fctudxo9jmhyo-51456868517.shopifypreview.com/#

Hey @Moeed !

Thanks! Here is the link to the shop:

https://kf2fctudxo9jmhyo-51456868517.shopifypreview.com/#

Hi @LizelStudio ,

This is Anthony from Beae Landing Page Builder, and I’m happy to assist you today.

While I acknowledge that this issue falls short of the desired outcome, I have an idea that I believe might be of help:

  1. Go to Online Store → Theme → Edit code
  2. Open your theme.liquid file
  3. Paste below code before :

Best regards,

Anthony

1 Like

Hello @LizelStudio

You can try this code: it will be helpful to you

Go to the Online Store->Theme->Edit code->Assets->queries.css>Add this code at the bottom.

@media screen and (max-width: 767px){
#big-footer {
    display: flex;
}
.gridlock .row .desktop-12 {
    width: 100%;
}
}

Hello there,

  1. In your Shopify Admin go to online store > themes > actions > edit code
  2. Find Asset > stylesheet.css and paste this at the bottom of the file:
.inside-wrapper {
width: auto!important;
}