Stacking context

A group whose layers stack together; z-index only compares within it.

What is a stacking context?

A stacking context is a group whose layers stack together. z-index only compares elements inside the same group, which is why a huge z-index sometimes doesn't help.

.card { position: relative; z-index: 1; }   /* a new stacking context */
.card .menu { z-index: 9999; }   /* can't rise above elements outside .card */

Level: Master · More CSS terms at this level

Updated September 27, 2026