Windows Dev Center

transform-style property

Gets or sets a value that specifies how child elements of the object are rendered in 3-D space.

This property is read/write.

CSS Transforms Module, Level 3, Section 9

 

Syntax

transform-style: flat | preserve-3d

Property values

One of the following 3-D rendering values.

flat

Default. Child elements are flattened using orthographic projection into the 2-D plane of the object.

preserve-3d

Child elements are not flattened and maintain their position in 3-D space.

CSS information

Applies Toblock-level and inline-level elements
Mediavisual
Inheritedno
Initial Valueflat

Standards information

Remarks

As of Microsoft Edge, the "-ms-" prefixed version of this property is not supported.

The value preserve-3d is supported as of Internet Explorer on Windows Developer Preview.

This property does not affect how the object is rendered.

This property is only applied to child elements that have a transform property specified.

The object is the projection plane for the child elements.

Child elements cannot intersect in flat mode.

Do not use the Microsoft vendor prefix ("-ms-") before the transform-style property. It is supported unprefixed in a Windows Store app using JavaScript.

To learn more about Cascading Style Sheets (CSS) transforms in a Windows Store app using JavaScript, see How to bring your webpage to life with CSS transforms, transitions, and animations.

See also

a
abbr
address
b
bdo
blockQuote
br
button
cite
code
CSSStyleDeclaration
currentStyle
dd
del
dfn
div
dl
dt
em
fieldSet
form
i
img
input
ins
kbd
label
li
map
object
ol
p
pre
q
samp
script
select
small
span
strong
style
sub
sup
table
tBody
td
textArea
tFoot
th
tHead
tr
ul
var
transform
How to bring your webpage to life with CSS transforms, transitions, and animations

 

 

Show:
© 2015 Microsoft