Problems with z-index

Hello, I have been trying for a long time to solve a problem that, in principle, should be simpler. I want to hide the main menu when opening a modal. Modals have a higher z-index than the menu, so I don’t know what I’m doing wrong. Can someone check it and tell me where I’m going wrong so the layers are not being respected?

You can see the issue by selecting the “Talento Z”, “Innovación” and “Validación” sections.

Thank you so much!

Here is my site Read-Only: [LINK][1]

Hi @jselva,

Try setting the ‘creamos’ section to position: relative with z-index: 9999 - this should fix your issue:

Hope this helps!

Thank you Milan :slight_smile:

But then the main menu is hidden when scrolling.

What should be above it is the “modal-c-impact-wrap” layer, which is with a z-index of 999, but it doesn’t work :\

Hi @jselva,

Sorry, you’re right!

Please try resetting the z-index on the ‘creamos’ section, then also resetting the z-index on ‘c-impacto’.

Quick video demo here: CleanShot 2022-07-15 at 19.42.41 · CleanShot Cloud

This should fix both issues!

Yes! Works! so the main issue was no reset the z-index into the “c-impacto” div.

Thank you so much Milan :slight_smile:

1 Like