third_party/WebKit/LayoutTests/transforms/rotate.html

   1 <!DOCTYPE html>
   2 <style>
   3 div {
   4     width: 100px;
   5     height: 100px;
   6     background-color: blue;
   7     transform-origin: 50% 50%;
   8 }
   9 .container {
  10     rotate: 45deg;
  11     background-color: red;
  12     perspective-origin: 150% 150%;
  13     perspective: 500px;
  14 }
  15 #box1 {
  16     rotate: inherit;
  17 }
  18 #box2 {
  19     transform: translate(200px);
  20     rotate: 50deg 1 0 0;
  21 }
  22 #box3 {
  23     transform: translate(200px);
  24     rotate: 30deg 1 -2.5 4;
  25 }
  26 #box4 {
  27     rotate: 45deg 0 0 0;
  28 }
  29 </style>
  30
  31 <div class="container">
  32     <div id="box1">1</div>
  33     <div id="box2">2</div>
  34 </div>
  35 <div id="box3">3</div>
  36 <div id="box4">4</div>