W3C home > Mailing lists > Public > www-style@w3.org > February 2012

Re: [css3-transforms] Why do we need a 'perspective' property?

From: Dirk Schulze <dschulze@adobe.com>
Date: Wed, 15 Feb 2012 20:00:42 -0800
To: Aryeh Gregor <ayg@aryeh.name>
CC: Simon Fraser <smfr@me.com>, "www-style@w3.org list" <www-style@w3.org>
Message-ID: <29FAEB78-5E45-405C-B345-80E9A8694C0F@adobe.com>
Aryeh, can you please summarize the discussion in a bug report? Thanks.

-Dirk

On Feb 7, 2012, at 9:39 AM, Aryeh Gregor wrote:

> On Tue, Feb 7, 2012 at 4:32 AM, Simon Fraser <smfr@me.com> wrote:
>> It seems very unintuitive to use scaleZ(0) to get this effect.
> 
> I suggest perspective() imply it, so you only need scaleZ(0) if you
> aren't using perspective.  This would be a problem if you want to use
> perspective() multiple times within a single 3D scene (so the
> flattening is a problem), but I can't think of when you'd want it.
> (It would always be possible using matrix3d(), just like you can do
> matrix3d(1,0,0,0, 0,1,0,0, 0,0,1,0, 0,0,0,3) if you want that effect
> for some reason . . .)
> 
> I wrote up a detailed proposal on the wiki:
> 
> http://wiki.csswg.org/reduce-3d-transform-properties
> 
>> It also results in singular
>> matrices that make it impossible to map points through elements with such a transform.
> 
> Can you give a specific example where that would be a problem?
> 
>> Here's an example where you want perspective and flattening:
>> 
>> <div style="perspective: 200px">
>>  <div style="transform: translateZ(100px); -webkit-transform-style: flat">
>>        Some content here that should not intersect with its descendants.
>>  </div>
>> </div>
>> 
>> With current UAs, "Some content here" looks larger because the Z translate brings
>> it closer to the viewer. The scaleZ(0) hack will cause it to look smaller, because it
>> gets pushed back to the plane of its parent.
> 
> In my proposal you could replace "perspective: 200px" by "transform:
> perspective(200px)" and it would work the same.  (Plus drop the
> transform-style, of course.)  It would cause the text to possibly
> intersect with its descendants, but in this example it doesn't have
> any, so that's okay.  Do you have a specific example like this one
> where it would be a problem for the text to intersect with its
> descendants?
> 
>>> Is there anything that couldn't be easily replicated by using
>>> perspective(), if transform-style: preserve-3d were the default and
>>> perspective() flattened things as I describe earlier in this post?  If
>>> so, could you please give a *specific* example, like actual markup?
>> 
>> My example above is one.
> 
> I gave the markup you'd need to replicate the effect in that specific
> example.  It's almost exactly the same as what you gave, no more
> complicated.
> 
Received on Thursday, 16 February 2012 04:01:16 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:50 GMT