third_party/WebKit/LayoutTests/fast/box-shadow/scaled-box-shadow.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4   <style type="text/css" media="screen">
   5     .wrapper {
   6       width: 280px;
   7       height: 280px;
   8       -webkit-box-sizing: border-box;
   9       padding: 40px;
  10       margin: 4px;
  11       display: inline-block;
  12     }
  13
  14     .box {
  15       position: relative;
  16       width: 100px;
  17       height: 100px;
  18       display: inline-block;
  19       box-shadow: 0 0 23px black;
  20       -webkit-transform-origin: top left;
  21     }
  22   </style>
  23 </head>
  24 <body>
  25   <!-- You should not see any pixel cracks in the shadows -->
  26   <div class="wrapper">
  27     <div class="box" style="transform: scale(0.63)"></div>
  28   </div>
  29
  30   <div class="wrapper">
  31     <div class="box" style="transform: scale(0.97)"></div>
  32   </div>
  33   <br>
  34
  35   <div class="wrapper">
  36     <div class="box" style="transform: scale(1.234)"></div>
  37   </div>
  38
  39   <div class="wrapper">
  40     <div class="box" style="transform: rotate(90deg) scale(1.377); -webkit-transform-origin: center;"></div>
  41   </div>
  42
  43 </body>
  44 </html>