paintedlayer-recycling-8-ref.html (948B)
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta http-equiv="content-type" content="text/html; charset=utf-8"> 5 <title>PaintedLayer recycling should use the right translation</title> 6 <style> 7 body { 8 overflow: hidden; 9 background-color: grey; 10 } 11 12 .fixed { 13 position: fixed; 14 width: 800px; 15 height: 800px; 16 } 17 18 .container { 19 position: relative; 20 top: 50px; 21 left: 50px; 22 width: 400px; 23 height: 400px; 24 z-index: 1; 25 pointer-events: none; 26 transform: scale(1.0); 27 } 28 29 .not-transformed { 30 background-color: lightblue; 31 width: 200px; 32 height: 200px; 33 position: absolute; 34 top: 0px; 35 left: 0px; 36 z-index: 1; 37 } 38 39 .transformed { 40 position: relative; 41 top: 50px; 42 left: 50px; 43 width: 200px; 44 height: 200px; 45 background: red; 46 transform: scale(1.5); 47 } 48 </style> 49 </head> 50 <body> 51 <div class="fixed"> 52 <div class="container"> 53 <div class="not-transformed"></div> 54 <div class="transformed"></div> 55 </div> 56 </div> 57 </body> 58 </html>