THE WORLD'S LARGEST WEB DEVELOPER SITE

Style backfaceVisibility Property

❮ Style Object

Example

Hide the backside of a rotating <div> element:

// Code for Chrome, Safari, Opera
document.getElementById("myDIV").style.WebkitBackfaceVisibility = "hidden";

// Standard syntax
document.getElementById("myDIV").style.backfaceVisibility = "hidden";
Try it Yourself »

Definition and Usage

The backfaceVisibility property defines whether or not an element should be visible when not facing the screen.

This property is useful when an element is rotated, and you do not want to see its backside.


Browser Support

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

Numbers followed by Webkit or Moz specify the first version that worked with a prefix.

Property
backfaceVisibility 36.0
12.0 Webkit
10.0 16.0
10.0 Moz
4.0 Webkit 23.0
15.0 Webkit

Note: Chrome (12-35), Safari and Opera 15+ support an alternative, the WebkitBackfaceVisibility property.


Syntax

Return the backfaceVisibility property:

object.style.backfaceVisibility

Set the backfaceVisibility property:

object.style.backfaceVisibility = "visible|hidden|initial|inherit"

Property Values

Value Description
visible Default value. The backside is visible
hidden The backside is not visible
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: visible
Return Value: A String, representing the backface-visibility property of an element
CSS Version CSS3

Related Pages

CSS reference: backface-visibility property


❮ Style Object