# WIP: Mega Menu dropdown Icon not taking styles

**URL:** <https://forum.bricksbuilder.io/t/wip-mega-menu-dropdown-icon-not-taking-styles/24616>\
**Category:** Bugs\
**Tags:** v1-9-9\
**Created:** [July 18, 2024, 9:05am UTC](https://forum.bricksbuilder.io/t/wip-mega-menu-dropdown-icon-not-taking-styles/24616 "2024-07-18T09:05:59Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![AnLip](https://forum.bricksbuilder.io/user_avatar/forum.bricksbuilder.io/anlip/32/6712_2.png) [@AnLip](https://forum.bricksbuilder.io/u/AnLip)\
**Post date:** [July 18, 2024, 9:05am UTC](https://forum.bricksbuilder.io/t/wip-mega-menu-dropdown-icon-not-taking-styles/24616/1 "2024-07-18T09:05:59Z")

</div>

**Browser** : Chrome Version 126.0.6478.127 (Build officiel) (arm64)  
**OS** : macOS Sonoma (latest)

When using the “planned” way of styling elements in of the Mega Menu: using the “Dropdown” element and choosing “Icon” in the styling tab, and setting an icon size, it has no effect because the styles are being inherited from the “Nav (Nested)” element that is further up in the DOM structure.

This should not happen since it forbids styling the icon differently than the texts.

Screen captures show the “1em” set to icons in the styling tab and the outputted CSS where the style is overriden by the “Nav (Nested)” element styles.

I do not want to style the texts using the “dropdown” elements, simply because not all menu items in the menu are dropdowns, some are plain text/links.

 ![Capture d’écran 2024-07-18 à 10.47.11](https://forum.bricksbuilder.io/uploads/default/original/3X/2/2/22b92b8103ddeeced890103bb6d18903c4ca216d.png)  
 ![Capture d’écran 2024-07-18 à 10.48.06](https://forum.bricksbuilder.io/uploads/default/original/3X/e/a/ea876bb7fbed4c1cb0a1de0dab0b131c80689858.png)

---

<div class="post-metadata">

**Author:** ![Matej](https://forum.bricksbuilder.io/user_avatar/forum.bricksbuilder.io/matej/32/20184_2.png) [@Matej](https://forum.bricksbuilder.io/u/Matej)\
**Post date:** [July 18, 2024, 10:29am UTC](https://forum.bricksbuilder.io/t/wip-mega-menu-dropdown-icon-not-taking-styles/24616/2 "2024-07-18T10:29:20Z")

</div>

Hi @AnLip ,

thank you for your bug report. Just to confirm it, this happens when you set “Typography → Font Size” in the “Top Level (Item)” menu, right? This was, so I was able to reproduce it.

If not, can you please record a video with steps to reproduce the problem, so I can investigate further.

Best regards,  
M

---

<div class="post-metadata">

**Author:** ![AnLip](https://forum.bricksbuilder.io/user_avatar/forum.bricksbuilder.io/anlip/32/6712_2.png) [@AnLip](https://forum.bricksbuilder.io/u/AnLip)\
**Post date:** [July 18, 2024, 3:03pm UTC](https://forum.bricksbuilder.io/t/wip-mega-menu-dropdown-icon-not-taking-styles/24616/3 "2024-07-18T15:03:06Z")

</div>

Hi,

No, this icon size of “1em” is set in the “ICON” tab of the “Dropdown” element.

There is no icon styling available if you go to the “Nav (Nested)” element that contains the entire Mega Menu, only “Top Level (Item \> Typography” but then that affects the entire typo + headings + icons, which is not what we need.

Thanks.

---

<div class="post-metadata">

**Author:** ![Matej](https://forum.bricksbuilder.io/user_avatar/forum.bricksbuilder.io/matej/32/20184_2.png) [@Matej](https://forum.bricksbuilder.io/u/Matej)\
**Post date:** [July 18, 2024, 4:05pm UTC](https://forum.bricksbuilder.io/t/wip-mega-menu-dropdown-icon-not-taking-styles/24616/4 "2024-07-18T16:05:24Z")

</div>

Hi @AnLip,

yeah, that is what I was asking. Maybe I was not clear enough, sorry for that!

This is indeed a problem and we are aware of it (it’s already on our task list), and there is a similar report already:

> [@WIP: Few properties under nav settings having more priority than the properties under dropdown](https://forum.bricksbuilder.io/t/wip-few-properties-under-nav-settings-having-more-priority-than-the-properties-under-dropdown/12810):
>
> Browser: Chrome 110 OS: macOS / URL: Link to a page that illustrates this issue This is happening with this properties: Icon → padding Icon → position Content → transform Content → transform (open) Step 1: Insert new Nav element. Step2: Change one of properties under nav element Step 3: Select the dropdown Step 4: Change the same property in the dropdown. (this one is not having "preference"on top of the other one) Thank You for the mega menu. You’re a great team!

In the previous report, the user described different properties, but yours is the same. My suggestion would be to add `!important` to the icon size, but I know this is not the best, or use classes on the Dropdown elements to style them, and not even use Top Level (Item) settings.

Best regards,  
M

---

<div class="post-metadata">

**Author:** ![tole011](https://forum.bricksbuilder.io/letter_avatar_proxy/v4/letter/t/ecccb3/32.png) [@tole011](https://forum.bricksbuilder.io/u/tole011)\
**Post date:** [July 27, 2025, 4:48pm UTC](https://forum.bricksbuilder.io/t/wip-mega-menu-dropdown-icon-not-taking-styles/24616/5 "2025-07-27T16:48:27Z")

</div>

Still an issue with 2.0. Menus inserted in the mega menu section inherit styles from the main menu. This makes styling very hard.  
The Element class .bricks-nav-menu is overriding the custom class.  
When editing the mega menu section, it looks fine, but in other instances (front and other templates’ canvas), it is incorrect.

---

<div class="post-metadata">

**Author:** ![tole011](https://forum.bricksbuilder.io/letter_avatar_proxy/v4/letter/t/ecccb3/32.png) [@tole011](https://forum.bricksbuilder.io/u/tole011)\
**Post date:** [July 27, 2025, 5:14pm UTC](https://forum.bricksbuilder.io/t/wip-mega-menu-dropdown-icon-not-taking-styles/24616/6 "2025-07-27T17:14:23Z")

</div>

Setting every property explicitly rectifies the problem.
