By Stephen Walker

I really like the new features available in Avada 7, but there are a couple of frustrations that have appeared post beta. This will address one such frustration – a mega menu in a custom header. The three issues I have noticed so far:

  • When you set the mega menu to full width or a custom width, the border radius features go away. While this makes sense for a full width menu, it does not for a custom width (assuming it is smaller than full width)
  • The bullets on the sub-menu items of a mega menu go away.
  • The headings of a mega menu have no styling available and do not use the text colors set in the submenu or menu options.  The should have the same styling capabilities as a header.

Fortunately, these three can be resolved quickly with some simple custom CSS. These are the settings I used on my old site to create this menu.

screenshot of a custom megamenu
Copy to Clipboard

Originally published on August 8, 2020

share the article


  1. Aviatedman September 9, 2021 at 1:47 pm - Reply

    At least you can USE the mega menu on custom header layouts!
    I’ve been working on my mega menu for 3 weeks and can’t figure out why the drop down content is stuck at a short height with scrollbars instead of displaying everything I xxxxxxx populate it with! Overlay settings don’t work.
    The ONLY way I can display mega menus accurately is to choose of the ridiculous default 7 menu options. Which sucks because that means I can’t use custom layouts at all.

  2. Chad Markham October 13, 2021 at 9:44 pm - Reply

    What if you want to remove the bullets? Any suggestions?

    • Stephen Walker October 14, 2021 at 4:57 am - Reply

      If you are using the custom header builder (recommended most of the time) and menu, the bullets should not be there. If you are using the default header system, you would need something like .ltr .fusion-menu-element-wrapper .fusion-megamenu-wrapper .fusion-megamenu-holder .fusion-megamenu .sub-menu>li>a .fusion-megamenu-icon {
      display: none;

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.


  • CSS Variables in Avada