compositing/overflow/transform-in-empty-container.html

<!DOCTYPE html>
<html><head>
<title>Transform in an empty container test.</title>
<style type="text/css">
  .composited {
    -webkit-transform: translateZ(0);
  }
  .abs {
    position: absolute;
  }

  .empty-transform {
    -webkit-transform: matrix3d(1, 0, 0, 0, 0, -1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    width: 0px;
    height: 100px;
  }

  .green {
    background-color: green;
  }
  .box {
    width: 50px;
    height: 50px;
  }
</style>
<script type="text/javascript">
  if (window.testRunner) {
    testRunner.dumpAsText(true);
  }
</script>
</head>

<body>

  <!--
     This div has a height, and is transformed to flip things inside it along the Y axis.
     While it does not have a width, overflow contents need to be transformed based on its height still.
    -->
  <div class="abs empty-transform">
    <div class="composited green box"></div>
  </div>

</body>
</html>