What is the purpose of z-index?

z-index controls stacking order of overlapping elements.

Example:

.box1 { z-index: 1; }

.box2 { z-index: 10; }

Higher values appear on top.

Key Takeaway:

Only works on positioned elements (position ≠ static).