Mega Menu issue

[Swift Ideas – Ed]

Please add this CSS:

#mega-menu-wrap-split_nav_left #mega-menu-split_nav_left > li.mega-menu-item > a.mega-menu-link, #mega-menu-wrap-split_nav_right #mega-menu-split_nav_right > li.mega-menu-item > a.mega-menu-link {
    height: 100%;
    line-height: inherit;
    vertical-align: top;
}

We’ll add that to the next update.

– Ed

[micheal_w]

Thanks Ed!

So this is the only CSS I’ll need to add to my live site to have the mega menu works?
You didn’t do anything else before, right?

[Swift Ideas – Ed]

The rest we updated your theme build – which is also included in the next update.

Thanks,

– Ed

[micheal_w]

Hi Ed,

Can you please advise when the next build is going out?
I would like to updated my live site too, but until the new update I can’t because the menu would be a mess…

[Swift Ideas – Ed]

Hi @micheal_w

It went out earlier today.

– Ed

[micheal_w]

This reply has been marked as private.

[Swift Ideas – Ed]

Hi @micheal_w

Not sure what has happened here – looking into it now.

– Ed

[Swift Ideas – Ed]

Ok so looks like all that was needed was to save the Max Mega Menu Settings in Appearance > Menus again – that sorted the styling. The only thing that seems different now is in the mega menu, the top items aren’t headings anymore, whereas they were before. This doesn’t show on the frontend, so not something the theme styling is doing wrong – has anything been changed on the backend?

– Ed

[micheal_w]

Hi Ed, thanks for fixing it with that simple save.

In regards to the headings, nothing has been changed (apart from updating the theme / plugins).
Would you have any recommendation how to have the top items headings again and remove that hover – bold effect (ex. on the PRODUCT item) that is not even a link.

[Swift Ideas – Ed]

I was able to adjust the styling for “PRODUCTS” and “YOU” but not the other 3, as they appear to have links applied to them?

– Ed

[micheal_w]

This reply has been marked as private.

[Swift Ideas – Ed]

They will match if you remove the links from the menu item in the backend.

You can remove those lines with this CSS:

#header li.mega-menu-flyout ul.mega-sub-menu li.mega-menu-item > a.mega-menu-link {
border-top-width: 0;
}

Thanks,

– Ed

[micheal_w]

This reply has been marked as private.

[Swift Ideas – Ed]

I’m not sure if it’s something that changed with the Max Mega Menu plugin, or the changes we needed to make to ensure 100% compatibility with the plugin, but we’ve added some CSS for you to make those appear the same. The CSS is:

li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-item  a.mega-menu-link:not([href]),
li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-item > a.mega-menu-link,
li.mega-menu-megamenu > ul.mega-sub-menu > section.container > li.mega-menu-item > a.mega-menu-link{
	color: #555;
  font-family: inherit;
  font-size: 16px;
  text-transform: uppercase;
  text-decoration: none;
  font-weight: bold;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 5px 0px;
  vertical-align: top;
  display: block;
  border-top: 0px solid #555;
  border-left: 0px solid #555;
  border-right: 0px solid #555;
  border-bottom: 0px solid #555;
	padding-top: 10px;
}

Not sure why, but in the mega menu settings for “WOMEN”, you had it set to align – right. Changed that back to default for you and that sorted it.

– Ed