third_party/WebKit/LayoutTests/compositing/overflow/transform-in-empty-container.html

   1 <!DOCTYPE html>
   2 <html><head>
   3 <title>Transform in an empty container test.</title>
   4 <style type="text/css">
   5   .composited {
   6     transform: translateZ(0);
   7   }
   8   .abs {
   9     position: absolute;
  10   }
  11
  12   .empty-transform {
  13     transform: matrix3d(1, 0, 0, 0, 0, -1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  14     width: 0px;
  15     height: 100px;
  16   }
  17
  18   .green {
  19     background-color: green;
  20   }
  21   .box {
  22     width: 50px;
  23     height: 50px;
  24   }
  25 </style>
  26 <script type="text/javascript">
  27   if (window.testRunner) {
  28     testRunner.dumpAsTextWithPixelResults();
  29   }
  30 </script>
  31 </head>
  32
  33 <body>
  34
  35   <!--
  36      This div has a height, and is transformed to flip things inside it along the Y axis.
  37      While it does not have a width, overflow contents need to be transformed based on its height still.
  38     -->
  39   <div class="abs empty-transform">
  40     <div class="composited green box"></div>
  41   </div>
  42
  43 </body>
  44 </html>