14 <div>This tests that z-index on non-positioned flex-items works. The green boxes should be above the orange boxes, which should be above the purple boxes, which are above the salmon boxes.
<div>
15 <div style=
"position:relative">
16 <div style=
"display:flex;">
17 <div class=
"flex-item" style=
"z-index: 1; background-color: salmon;"></div>
18 <div class=
"flex-item" style=
"z-index: 100; background-color: orange;"></div>
20 <div class=
"positioned" style=
"top: 0; z-index: 150; background-color: green"></div>
21 <div class=
"positioned" style=
"top: 25px; z-index: 50; background-color: purple"></div>
23 <div style=
"position:relative">
24 <div style=
"display:flex;">
25 <img class=
"flex-item" style=
"z-index: 1; background-color: salmon;"></img>
26 <img class=
"flex-item" style=
"z-index: 100; background-color: orange;"></img>
28 <img class=
"positioned" style=
"top: 0; z-index: 150; background-color: green"></img>
29 <img class=
"positioned" style=
"top: 25px; z-index: 50; background-color: purple"></img>