z-context

Download extension

A Chrome DevTools Extension that displays stacking contexts and z-index values in the elements panelWhy use it? Browsers support a hierarchy of stacking contexts, rather than a single global one. This means that z-index values are often used incorrectly, and arbitrarily high values get set.

By Using Z-Context, you'll know:

- If the current element creates a stacking context, and why
- What its parent stacking context is
- The z-index value
--------
v1.0.4 - fixes will-change case. a stacking context is created for opacity/transform but not other values https://github.com/gwwar/z-context/pull/9
v1.0.3 - fixes display reason for flex-items https://github.com/gwwar/z-context/pull/4
v1.0.2 - adds new z-index rules, fixes a bug when inspecting a shadow dom elements. https://github.com/gwwar/z-context/pull/3
v1.0.1 - fix reason message for non-static positions, props to giuseppeg. https://github.com/gwwar/z-context/pull/1