codermonk

CSS 3D Transforms Module Level 3: "The ‘transform-style’ property defines how nested elements are rendered in 3D space. If the ‘transform-style’ is ‘flat’, all children of this element are rendered flattened into the 2D plane of the element. Therefore, rotating the element about the X or Y axes will cause children positioned at positive or negative Z positions to appear on the element's plane, rather than in front of or behind it. If the ‘transform-style’ is ‘preserve-3d’, this flattening is not performed, so children maintain their position in 3D space.
This flattening takes place at each element, so preserving a hierarchy of elements in 3D space requires that each ancestor in the hierarchy have the value ‘preserve-3d’ for ‘transform-style’. But since ‘transform-style’ affects only an element's children, the leaf nodes in a hierarchy do not require the perspective style."

'via Blog this'