layout/reftests/transform-3d/perspective-origin-3-ref.html

   1 <!DOCTYPE html>
   2 <html xmlns="http://www.w3.org/1999/xhtml">
   3   <style type="text/css">
   4
   5 .parentWithPerspective {
   6   -moz-perspective: 100px;
   7   -moz-perspective-origin: 150px 150px;
   8   -webkit-perspective: 100px;
   9   -webkit-perspective-origin: 150px 150px;
  10   /* Changing width/height to 500px should not change the rendering. */
  11   height:100%;
  12 }
  13
  14 .parentWithPerspective > div {
  15   position:absolute;
  16   top:100px;
  17   left:100px;
  18   width:100px;
  19   height:100px;
  20 }
  21
  22 .notTransformed {
  23   outline: 1px solid black;
  24 }
  25
  26 .transformed {
  27   background:blue;
  28   -moz-transform-origin: 0% 0%;
  29   -moz-transform: rotateY(45deg);
  30   -webkit-transform-origin: 0% 0%;
  31   -webkit-transform: rotateY(45deg);
  32 }
  33
  34   </style>
  35   <body>
  36     <div class="parentWithPerspective">
  37       <div class="notTransformed"></div>
  38       <div class="transformed"></div>
  39     </div>
  40   </body>
  41 </html>