layout/reftests/transform-3d/split-intersect2.html

   1 <!DOCTYPE html>
   2 <html>
   3
   4 <head>
   5 <meta http-equiv="content-type" content="text/html; charset=UTF-8">
   6 <meta charset="utf-8">
   7 <title>Split intersect 2</title>
   8
   9 <style>
  10 .container {
  11   margin: 0 0;
  12   width: 400px;
  13   height: 400px;
  14
  15   transform-style: preserve-3d;
  16 }
  17
  18 .shape {
  19   margin: 0 0;
  20   position: absolute;
  21
  22   width: 30px;
  23   height: 100px;
  24 }
  25
  26 .red {
  27   background-color: rgba(255,0,0,1);
  28   transform: translate(100px, 100px) rotateZ(90deg) rotateY(60deg);
  29 }
  30
  31 .green {
  32   background-color: rgba(0,255,0,1);
  33   transform: translate(80px, 100px);
  34 }
  35
  36 .blue {
  37   background-color: rgba(0,0,255,1);
  38   transform: translate(120px, 100px);
  39 }
  40 </style>
  41 </head>
  42
  43 <body>
  44   <div class="container">
  45     <div class="shape red"></div>
  46     <div class="shape green"></div>
  47     <div class="shape blue"></div>
  48   </div>
  49 </body>
  50 </html>