<!DOCTYPE HTML> <title>Testcase for outline around 3-D transform</title> <style> html, body { margin: 0; padding: 0; border: none } div { width: 100px; height: 100px; } body > div { margin-top: 200px; margin-left: 200px; transform-style: flat; outline: 2px dashed blue; } body > div > div { transform: rotateX(30deg); transform-origin: 50% 50%; transform-style: preserve-3d; } body > div > div > div { transform: rotateX(30deg); transform-origin: 50% 50%; transform-style: preserve-3d; } body > div > div > div > div { transform: scale(1.5, 3); transform-origin: 50% 50%; background: rgba(255, 255, 0, 0.4); } </style> <div><div><div><div></div></div></div></div>