CSS backface-visibility Property

Definition and Usage

The backface-visibility property defines whether the element is visible when it is not facing the screen.

This property is very useful if you do not want to see the back of a rotating element.

See Also:

HTML DOM Reference Manual:backfaceVisibility Property

Example

Hide and show the back of two rotating <div> elements:

#div1 {
  -webkit-backface-visibility: hidden; /* Safari */
  backface-visibility: hidden;
}
#div2 {
  -webkit-backface-visibility: visible; /* Safari */
  backface-visibility: visible;
}

Try It Yourself

CSS Syntax

backface-visibility: visible|hidden;

Property Value

Value Description
visible The back is visible.
hidden The back is not visible.

Technical Details

Default Value: visible
Inheritance: no
Version: CSS3
JavaScript Syntax: object.style.backfaceVisibility="hidden"

Browser Support

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

Numbers with -webkit- or -moz- prefixes indicate the first version using the prefix.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
36.0
12.0 -webkit-
10.0 16.0
10.0 -moz-
4.0 -webkit- 23.0
15.0 -webkit-