| property (crossed out if not supported) (red if not expected to be stacking context) |
establishes stacking context | over later inline | over earlier and negative z-index positioned elements | under later and positive z-index positioned elements | fixed-pos containing block (should only pass for some) | grouping property (based on preserve-3d) yes/no | grouping property (based on mix-blend-mode in SVG) yes/no | stacking context (based on mix-blend-mode in HTML) yes/no |
|---|---|---|---|---|---|---|---|---|
|
|
|
|
|
|
|
|
transform-style: flat doesn't cause creation of a stacking contextisolation, will-change)clip-path: <geometry-box> is brokenwill-change supportcontain: layout should establish a containing block for absolute/fixed positioned descendants (when contain is enabled)getPropertyValue doesn't work for rotate, translate, and scale, and maskImage, making them appear unsupported when they're actually supported (worked around this one already)opacity or filter (though it's hard to believe there's no stacking context at all), but it does sort them as positioned descendantsclip-path, mask, and mask-image don't sort as though they are positioned in the z-order, and the first two also don't cause creation of a stacking contextmask: url() doesn't do any maskingmask doesn't cause creation of a stacking contextcontain:layout doesn't cause creation of a stacking context for absolute and fixed positioned elementswill-change: contain doesn't cause creation of a stacking context or containing block for abs/fixed-pos descendantstransform don't establish a containing block for absolutely positioned and fixed positioned descendantsclip-path: url() and mask: url() don't do any clipping/maskingclip-path and mask don't cause creation of a stacking context