Solve your z-index issues | z-index and stacking context explained

While it would be handy (at times) for z-index to be a global value, the truth is, it isn’t. It’s related to its local stacking context, which can be created by a parent with its own z-index value, but also by other properties such as transform, opacity, and many more, which is something most people aren’t aware of. In this video, I look at what CSS stacking context is, both at how it works with z-index, but also why z-index isn’t the only CSS property which creates a stacking context, and how problems can arise that you might not expect as you style your pages, with an attempt at not just looking at the theory, but how it can can problems in the real world. MDN stacking context, with full list of properties which create a new stacking context: Codepens: --- I have a