How can I reduce the width of my mega menu?

[Bramm]

https://gha335ee8tuz5bcw-53265825967.shopifypreview.com

Would like to reduce to width of my mega menu. It doesn't need to take up the entire screen. If possible I would also have the columns closer to each other 

Thank you

 

[PageFly-Kate]

Hi @Bramm ,

This is Kate from PageFly - Landing page builder, I’d like to suggest this idea:

Step 1: Go to Online Store->Theme->Edit code
Step 2: Asset->/styles.css->paste below code at the bottom of the file:

.mega-dropdown {
left: auto !important
right: auto !important
with: 50% !important
}

Hope my answer will help you

[Bramm]

Thank you for the response, that code doesn't seem to do anything 

[PageFly-Kate]

Hi @Bramm ,

You can try again with the code below: 

.mega-dropdown {
left: 50% !important
with: 75% !important
}

[GemPages · Accepted solution]

Hello @Bramm 

It's GemPages support team and glad to support you today.

You can follow these steps:

1. Go to Online Store -> Theme -> Edit code

2. Open your styles.css file and paste the following code below: 

.mega-dropdown{
  left: 50% !important;
  transform: translate(-50%) !important;
  width: 50% !important;
}

 If you require any further information, feel free to contact me.
Best regards,
GemPages Support Team

[DownEastClothin]

How do I do this if I don't have the "styles.css" file?