Why can z-index: 999999 lose?

Briefing

An element with z-index: 999999 is painted underneath an element with z-index: 2. No !important, no JavaScript, no browser bug. Why?

Two overlapping elements. One asks for 999999. The other asks for 2. The 2 wins. Nothing is broken.

Laboratory

CSS Lab

Level

ENGINEER

Estimated time

9 minutes

Method

interactive

Variables under observation

stacking contextpainting orderz-indexcontaining blockisolation