Nav Menu (not nestable) with Mega Menu - Menu's in the Mega Menu Template takes style from the top level Menu

1

Nav Menu (not nestable) with Mega Menu - Menu’s in the Mega Menu Template takes style from the top level Menu.

I am adding menu styles to a class on the Nav Menu,
But it applies to all the sub menus I have in the mega menu template.

1 Like
2

Almost one year later and many new versions, still the same behavior. Any chance for some workaround?

Best regards,
Goran

1 Like
3

To fix your issue with the Mega Menu template inheriting styles from the top-level Nav Menu, try these steps:

  1. Separate Classes: Ensure top-level and sub-menus have distinct class names.
  2. Specific CSS Selectors:
    .top-level-menu > li {
    /* Styles for top-level menu */
}
.mega-menu-template .sub-menu {
    /* Styles for sub-menus */
}
  3. Override Inherited Styles:
    .mega-menu-template .sub-menu {
    color: inherit; /* Override inherited styles */
}

This should help keep the styles distinct between your Nav Menu and Mega Menu.