3 ms·
(I'm guessing that) since opacity is a "postprocessing operation"[1] it has to 'redraw' the entire div which causes it to fall back to it's parent order in the
by flexxaeon 14y ago
(I'm guessing that) since opacity is a "postprocessing operation"[1] it has to 'redraw' the entire div which causes it to fall back to it's parent order in the stack.
But I'm not sure if this is a fair assessment, as you're applying opacity to the div instead of the span.red, the element where the rule was applied. When adding opacity to the span the z-index stays intact
[1] http://www.w3.org/TR/css3-color/#transparency http://www.w3.org/TR/css3-color/#transparency
- ricardobeat 14y agoThat's the underlying reason - the same is true for position, if they didn't create new contexts rendering would be an impossible mess. Adding opacity to the span has no effect because it already has position:absolute.
- seanalltogether 14y agoWhich is strange because many other frameworks will end up popping elements with postprocessing effects to the top of the stack, rather then rerender the entire stack.