<!DOCTYPE html> <html><head> <style> .preserve { transform-style: preserve-3d; } .leaf { width: 300px; height: 300px; position:absolute; transform: translateZ(0px); background-color: red; top: -220px; left: -20px; } </style> </head><body> <canvas id="canvas" width="200" height="200"></canvas> <div class="preserve"> <div class="preserve" style="opacity:0.0001"> <div class="leaf"></div> </div> </div> </body> <script> var canvas = document.getElementById("canvas"); var ctx = canvas.getContext("2d"); ctx.fillStyle = "green"; ctx.fillRect(0, 0, 200, 200); </script> </html>