CSS I bet you didn't know: Episode 1: z-index stacking context

I just ran into a situation where another developer tried to resolve a problem with z-index by setting the element’s z-index to 9999999999999999. They were probably pretty frustrated to see that it didn’t work and that element was still being covered.

This was due to z-index’s stacking context. If the element is contained in a parent element who also has a z-index set and that z-index is lower than the z-index you’re trying to beat, the child will never be on top no matter how high you set the value.

Great example illustrating this here: https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Understanding_z_index/The_stacking_context