transform: rotateX(xxxdeg);

[Rolf b]

preserve-3d war der entscheidende Hinweis. Vermutlich rechnet er dann aufwändiger, jedenfalls ist die 3D-Modellierung dann korrekt.

Hier ist die fertige Button-Box

Der beste Beweis, dass HTML ein Feature zum Definieren von wiederverwendbaren 3D Objekten fehlt. Oder dass ich es nicht kenne.

Aber ein Anwendungsbeispiel für scale3d ist das immer noch nicht :(