Global menu goes behind content below

I made my menu a global but now the drop down menus go behind the content below. I cant see how to stop this?

You’ll probably just need to adjust the z-index on your menu. Can you try switching the Z-Index to “Custom” and “31” along with the “Isolation” setting to “Isolate”.

If it’s still not working, share your project via Elements Cloud and well take a look at fix it for you :slight_smile:

1 Like

Deleted my last post, cloud upload is working now and project is uploaded. I have only made the menu of the home page global for now.

Why 31? Magical number?

1 Like

Containers are 30

1 Like

Is there an overview for something like this? That could help clueless users like me be a little less lost in the future. I still haven’t understood how z-index works …

1 Like

https://tailwindcss.com/docs/z-index

You can see how content gets stacked, higher the number the higher position in the stack, negative or positive, positive higher

a bit more complicated than 31 depends on component and its position

2 Likes

thx

Thanks Dan,

I have fixed this, I needed to make the settings you describe to the global and not just to the menu. Thanks again for your amazing support!

i have this ‘sudden’ problem with a drop-down in the menu hiding from the picture below. Can you have a look a this please… kinda desperate now :wink:
elementsapp://downloadDocument/Si4UaT9yoiLo

@jvanodenhoven

One way of doing it, if the menu was outside your navigation container your settings would work, the container needed z-31

1 Like

Thanks a lot, Steve, for helping me out! I really appreciate it — I was going round in circles.

1 Like