<!DOCTYPE html> <html> The green square below should be centered. <div style="width: 400px; height: 400px; position: absolute; perspective: 600px; left: 50%; top: 50%; background: green;"> </div> <script> document.body.offsetWidth; document.querySelector("div").style.transform = "translate(-50%, -50%)"; </script> </html>