Figure 6.40. A containing element with perspective-origin: -50% -50%Aswithtransform-origin,theinitialvalueofperspective-originis50% 50%—the
centerpointofthecontainingelement.Valuesforperspective–originmaybe
lengthsorpercentages.
Positioningkeywords—left,right,top,bottom,andcenter—arealsovalid.The
centerkeywordisthesameas50% 50%.Bothbottomandrightcomputetopositions
of100%alongtheverticalandhorizontalpositionsrespectively.Thetopandleft
keywordscomputetoverticalandhorizontalpositionsof0%.Inallcases,perspect-
ive-originisanoffsetfromthetop-leftcornerofthecontainer.
Preserving Three Dimensions with transform-style
Asyouworkwith3Dtransforms,youmaystumbleacrossascenarioinwhichyour
transformsfailtowork—ortheywork,butonlyforoneelement.Thisiscausedby
groupingpropertyvalues.^12 SomecombinationsofCSSpropertiesandvaluesrequire
thebrowsertoflattentherepresentationofchildelementsbeforethepropertyis
applied.Theseincludeopacitywhenthevalueislessthan 1 andoverflowwhen
thevalueissomethingotherthanvisible.
(^12) http://dev.w3.org/csswg/css-transforms-1/#grouping-property-values
CSS Transforms 265