THE WORLD'S LARGEST WEB DEVELOPER SITE
HTMLCSSJAVASCRIPTSQLPHPBOOTSTRAPJQUERYANGULARXML
 

Style transformStyle Property

Style Object Reference Style Object

Example

Let the transformed child elements preserve the 3D transformations:

document.getElementById("myDIV").style.transformStyle = "preserve-3d";
Try it Yourself »

Definition and Usage

The transformStyle property sets or returnd how nested elements are rendered in 3D space.

Note: This property must be used together with the transform property.


Browser Support

The numbers in the table specify the first browser version that fully supports the property.

Property
transformStyle 36.0 11.0 16.0 Not supported
Use WebkitTransformStyle
23.0

Syntax

Return the transformStyle property:

object.style.transformStyle

Set the transformStyle property:

object.style.transformStyle="flat|preserve-3d|initial|inherit"

Property Values

Value Description
flat Default value. The child elements will NOT preserve its 3D position
preserve-3d The child elements will preserve its 3D position
initial Sets this property to its default value. Read about initial
inherit Inherits this property from its parent element. Read about inherit

Technical Details

Default Value: flat
Return Value: A String, representing the transform-style property of an element
CSS Version CSS3

Related Pages

JavaScript Style Object: transform property

CSS reference: transform-style property


Style Object Reference Style Object