Does z-index specify the stack level of a non-positioned flex item?

Question

In CSS 2.1, z-index only applies to positioned elements, and specifies two different things:

1. The stack level of the box in the current stackin

Answer 1

CSS Working Group:

The CSSWG couldn't think of a good reason to make flex items establish pseudo-stacking contexts, so we have resolved to treat them the same way as block and table cell elements.

_{source: https://lists.w3.org/Archives/Public/www-style/2012Jul/0382.html}

More information:

• [css3-flexbox] Painting order
• [css3-flexbox] Paint flex items atomically?
• [css3-positioning] z-index and pseudo-stacking contexts
• [css3-flexbox][css-ALL] Should z-index Just Work on flex items?

---

Also, although not a direct answer to the question, the following W3C Editor's Drafts provide strong hints as to where CSS is going with z-index and stacking contexts.

11. Layered presentation ~ CSS Positioned Layout Module Level 3

12. Detailed stacking context ~ CSS Positioned Layout Module Level 3

4.3. Z-axis Ordering: the z-index property ~ CSS Grid Layout Module Level 1

It's interesting to note that z-index, as currently defined in the CSS Positioned 3 Editor's Draft, applies only to positioned elements. This is no different than CSS 2.1. Yet grid items and flex items can both create stacking contexts with z-index, even when position is static.