Expanding über menu on mobile

Hi, I’ve created an uber menu. When it’s displayed on mobile the bar expands for the main items, but not for the submenu which is partially cut off. Is there a way to get the height of the bar to adjust for submenu items too? How do I solve this? Thanks.

Hi,

In mobile I suggest you make the sub menus open below the parent menu item instead of the side.

Kindly check the links below for your reference.


Hope that helps

Thank you Paul. Do you mind being more specific? The submenu currently opens below the parent menu item on mobile. I have had a quick look at the resources you have suggested and played around with the submenu position setting for that menu item and I have not been able to fix it. Is there any way for the bar that it is inlined in to adjust height automatically in response to the submenu, like it does when I open the menu?

Hi,

Sorry for not being specific. I checked again and it seems to be an issue with stack order of your bars.

To fix your menu being cut off, I increased the z-index of your Bar 1 so that it doesn’t go under your logo.

The z-index property specifies the stack order of an element.

An element with greater stack order is always in front of an element with a lower stack order.

Kindly check in your end.

Thanks

1 Like

Thank you so much for your explanation. It works perfectly now.

You’re welcome!
Thanks for letting us know that it has worked for you.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.