This example shows the effect of
-webkit-transform-style. The blue box has perspective set on it.
The purple box has
which allows the yellow and green boxes to live in a shared 3D space, and thus appear to stand away from the purple box by virtue of their transforms.
However, when you hover, we set the purple box to:
so its children collapse into it. Their
-webkit-transform still applies, but now
it's just a painting effect, and is not affected by the container's perspective.