| OLD | NEW | 
|---|
| (Empty) |  | 
|  | 1 <!DOCTYPE html> | 
|  | 2 <style> | 
|  | 3 div { | 
|  | 4     width: 100px; | 
|  | 5     height: 100px; | 
|  | 6     background-color: blue; | 
|  | 7 } | 
|  | 8 .container { | 
|  | 9     background-color: red; | 
|  | 10     perspective-origin: 150% 150%; | 
|  | 11     perspective: 500px; | 
|  | 12     scale: 0.5 1; | 
|  | 13 } | 
|  | 14 #box1 { | 
|  | 15     scale: 0.5 1; | 
|  | 16 } | 
|  | 17 #box2a { | 
|  | 18     scale: -2 3.5 0.2; | 
|  | 19     transform: translate(400px); | 
|  | 20 } | 
|  | 21 #box2b { | 
|  | 22     backface-visibility: visible; | 
|  | 23     scale: -2 3.5 0.2; | 
|  | 24     transform: translate(400px); | 
|  | 25 } | 
|  | 26 #box3 { | 
|  | 27     scale: 2 3.5 0.2; | 
|  | 28     transform: translate(200px, 100px); | 
|  | 29 } | 
|  | 30 #box4 { | 
|  | 31     scale: 2; | 
|  | 32     transform: translate(50px, 100px); | 
|  | 33 } | 
|  | 34 </style> | 
|  | 35 | 
|  | 36 <div class="container"> | 
|  | 37     <div id="box1">1</div> | 
|  | 38     <div id="box2a">2a</div> | 
|  | 39     <div id="box2b">2b</div> | 
|  | 40 </div> | 
|  | 41 <div id="box3">3</div> | 
|  | 42 <div id="box4">4</div> | 
| OLD | NEW | 
|---|