Z-index controls the stacking order of elements, to determine which elements appear on top of others in the visual layout. It allows you to create interesting UI’s and visual designs by creating depth (literally).

But create web-apps or sites for long enough and soon you come across a z-index issue. Over the years I’ve explored and used many techniques to battle them. From z-index maps (back in the SCSS days) to throwing in the towel and just adding z-index: 99999. (╯°□°）╯︵ ┻━┻

Let’s look at a common example.