Learning on Web Dev Open is free for all.

ArcadeStack Up
Arcade

Stack Up

Phase 01 · Take It ApartPlayable

Three overlapping cards, three probe points. Make the right one win at each.

0 / 5 cleared
Stage
A
B
  • probe 1 · wants a · found …
  • probe 2 · wants b · found …
Level 1 · Source order

Two cards, and the later one is winning. Put the first one on top without moving it in the markup.

.card-a { position:
.card-a { z-index:

The probes are checked with document.elementFromPoint on the real stage, so the browser is the referee. If a level says something surprising about stacking contexts, that is the browser saying it, not us.