Full width Mega menu

[swanhaven]

Hello, I’m playing with the new “mega menu dropdowns” and I was wondering if there is way to either control the dropdown so it’s anchored in the center of the view area instead of on the toggle or to simply make the dropdown area “full width”. I would like to add some more content to them and style them different but I need to solve this issue first before I can really get any further. I’ve already played with controls and then I checked the css to see if there was an obvious way to miniplate it, but I haven’t been able to find anything. I have attached a screen shot of what I currently have.

[tristup]

Hi @swanhaven,

Thanks for reaching out.
You can change the width of the Mega Menu dropdown from the Maximum and Minimum width options shown in the screenshot.

Hope it helps.
Thanks

[swanhaven]

The only problem with that is when I set it to 100%, the anchor stays the same and then the menu goes off the screen. See attached screen shot.

[tristup]

Hi @swanhaven,

Can you please provide login credentials for your site in a secure note to examine it further, including:

– WordPress Site URL & Login URL
– Specific page URL where you are having this issue
– WordPress Admin username/password

To create a secure note, click the key icon underneath any of your posts.

Thanks

[swanhaven]

I added a secure note for you. Thanks for your help.

[ruenel]

Hello @swanhaven,

I have checked your header. Since you want it fullwidth, you can insert an inline element CSS to the Megamenu element settings:

$el.x-dropdown {
  top: 0;
  left: 0 !important;
}

And then make sure that the minimum width of the dropdown is 100%.

Best Regards.

[swanhaven]

@ruenel

$el.x-dropdown {
  top: 0;
  left: 0 !important;
}

Awesome, thanks for your help!

[marc_a]

Hi @swanhaven,

You’re welcome and it’s our pleasure to help you! If you have any other concerns or clarifications regarding our theme features, feel free to open up a new thread.

Thank you.