What No One Told You About Z-Index — Philip Walton
Most developers misunderstand z-index because they don't realize that z-index values only matter within a **stacking context**, which is a group of elements that move together in the stacking order. Stacking contexts are created when an element is the root element, has position and z-index set, or has an opacity less than 1—and this third method is rarely known outside specification documents. The article demonstrates this through a puzzle where adding opacity to a parent element causes its child's high z-index to become irrelevant, since the child is now confined to a lower stacking context created by that opacity rule.