<!DOCTYPE html>
<html>
<head>
<style type="text/css">
div {
  width: 96px;
  height: 96px;
  background-color: green;
  margin: 10px;
}

#one {
  -webkit-transform: translateZ(-1px); /* this moves the element "behind" the page */
}

#two {
  -webkit-transform: translateZ(1px);
}

</style>
</head>

<body>
  <!-- both should be visible - two green squares in the page -->
  <div id="one"></div>
  <div id="two"></div>
</body>
</html>