HTML and CSS Reference
In-Depth Information
Figure 13-2
Google Chrome zoomed out to show the empty div with a black border around it.
With the main content container
<div id=”main” class=”group”>
set to have a perspective of
1000px
, its
direct child elements can be moved in that 3D space, which is what you can do with the empty
<div
class=”temp”>:
-webkit-transform: translateZ(-500px);
After you transform the empty
<div class=”temp”>
and move it back 500 pixels on the Z axis, it appears to
move away from the viewer, as shown in Figure 13-3.
