Why is my Z-index not working?

Hello, I have an issue with the z-index.
I have a div and its child component has a position:absolute . When I add a higher z-index to the parent, the child remains on top.
Here’s codepen → https://codepen.io/VeljkoCukic/pen/oNWrMRb

Stacking context (check out this link) isn’t exactly trivial, dive into it if you like.

If you want to show your .container above the .modal, you have to remove the z-index from the .container, and set the z-index of your .modal to -1.

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