Return to previous page

Mega menu inherts submenu’s style like border and background

This topic has 2 replies, 2 voices, and was last updated 6 days, 18 hours ago ago by Jack Richardson

qiuyuanyuan

Participant

August 17, 2026 at 03:58

Hi,
I am running into a styling issue: the mega menu is inheriting styles from the regular second‑level sub‑menus.

I have two main‑level menu items: sunglasses and sports.
sunglasses is set up as a mega menu using a static block, while sports has standard dropdown sub‑menu items underneath it.
For instance, the default sub‑menu styles include a 1px #888888 border and background:#f7f7f7.
The mega menu is automatically wrapped in an outer container with the sub‑menu styles, which is causing it to pick up these unwanted styles. Please refer to the attachement page 1 & 2.
Could you please advise how I can prevent the mega menu from inheriting the sub‑menu styles?
Thank you.

Regards
Qyuan

Files is visible for topic creator and
support staff only.

#473749 Copied

1 Answer
Jack Richardson

Support staff

August 17, 2026 at 07:57
Hello @qiuyuanyuan,

If you wish to reset the styling of the submenu wrapper for menu items containing static blocks, you may consider using the following custom CSS snippet:

.elementor-widget-theme-etheme_nav_menu .menu-static-block.nav-sublist-dropdown { border: none; background: transparent; }

You can view the frontend result here: https://gyazo.com/ad2bf6838aaed2ae03cd509ed7d22e2c

However, please note that the mega menu with a static block will become transparent then. Therefore, you may set any background on the main section in Elementor editor of your mega menu, similar to how you set the border, box-shadow, etc. You can see an example here: https://gyazo.com/43cea4abef742585cc36b5ada88b9035

Custom CSS usage: https://www.8theme.com/documentation/xstore/additional-customisation/optimal-placement-for-custom-css-code/

Best Regards,
Jack Richardson
The 8Theme’s Team
#473792 Copied
Viewing 2 results - 1 through 2 (of 2 total)