The 3D transforms in this demo work in latest Safari, latest latest Chrome, latest Firefox, and versions of Opera running the Blink rendering engine. Browsers without 3D acceleration just switch the z-index, so you won't lose any functionality.
These cards are using
-webkit-transform: rotateY() and rotateX(); with some of the 3D settings:
-webkit-transform-style: preserve3d; and
Mozilla browsers are using the
The effect on this box can be done using 100% CSS.
yes, I'm a little crooked