Re: Transforms and z-index (Was: [CSSWG] Minutes and Resolutions 2011-04-20)

On 22/04/2011 05:05, Simon Fraser wrote:
> On Apr 21, 2011, at 7:27 pm, fantasai wrote:
>
>> Transforms
>> ----------
>>
>>   <glazou>  http://www.w3.org/mid/AF6CAE42-3067-4B7F-9F6D-31502ECFE327@me.com
>>   glazou: Next is about z-index.
>>   smfr: The Transforms spec says that transformed elements act like
>>         "relatively positioned element".
>>   smfr: Webkit has this just create a pseudo-stacking context (like 'opacity'
>>         does), but FF and maybe IE let z-index work.
>>   smfr: I argued that we don't let left/top/etc apply, so z-index shouldn't
>>         either.  So my proposal is that we change the spec to have transforms
>>         create a pseudo-stacking context like 'opacity' instead.
>>   dbaron: I don't particularly care, but I think it might be good to ask
>>           authors.
>>   smfr: If authors want to apply z-index, they can just actually make it
>>         relpos.
>>   fantasai: I think having to use relpos for z-index is confusing anyway.
>>   smfr: Stacking contexts are confusing anyway.
>>   sylvaing: What about opacity?  z-index doesn't apply?
>>   smfr: No.
>>   sylvaing: So you're just wanting to make it consistent with opacity.
>>             Sounds good.
>>   RESOLVED: transforms create a pseudo-stacking context, not a full one.
>>             z-index doesn't apply.
>
> I realized that was forgetting part of the story here.
>
> A transformed element acts as a stacking context  (like one with opacity). But
> it also acts as a positioning container for its descendants, so, for example, a
> position:relative child's left and top are relative to its transformed ancestor in
> that case, again as if the transformed element itself has position:relative.
>
> I don't think this changes the fact that z-index should not apply to a transformed
> element (just as 'left' and 'top' do not apply), but I wanted to mention it in case
> someone disagrees.

Simon, what did you mean by "pseudo stacking context" in the minutes and 
resolutions?

For me, pseudo stacking context means having the behaviour that 
non-positioned floats, non-positioned inline tables, non-positioned 
inline blocks and position:relative z-index:auto elements have, which is 
that they're responsible for painting certain descendants but that real 
stacking context descendants are the responsibility of the closest 
ancestor real stacking context.

I think that you're (incorrectly, according to CSS21) using it to mean 
elements which form stacking contexts but to which the z-index property 
doesn't automatically apply.  CSS21 defines z-index as only applying to 
positioned elements, but I must admit that I assumed that it was 
expected to apply to _all_ real stacking contexts (all of which happen 
to arise from positioned elements in CSS21, but that's just 
coincidence).  However, CSS3-color is explicit that opacity gives rise 
to real stacking contexts but that z-index does not apply, so my 
assumption was incorrect.

Which of the following three behaviours is being debated for transforms?
(i) Pseudo stacking context behaviour as per non-positioned floats;
(ii) real stacking context behaviour as per opacity;
(iii) real stacking context behaviour + z-index applying despite not 
necessarily being positioned (no precedent for this behaviour)

(My impression is that it's the latter two.)

Cheers,
Anton Prowse
http://dev.moonhenge.net

Received on Friday, 22 April 2011 15:27:05 UTC