transform: rotateX(xxxdeg);

[Rolf b]

Na ich weiß nicht. Nach Richards Hinweis habe ich den Perspective-Style korrekt platziert (und ja, ein transform war falsch geschrieben). Ergebnis hier. Wenn man aus einem nicht allzu flachen Winkel draufschaut, sieht es auch halbwegs richtig aus. Aber wehe, man dreht das div.dreid zu weit nach hinten. Wenn ich Quadrate mit Kantenlänge 80px habe und einen transformZ(100px), dann sollten die Quadrate sich deutlich weiter von der Grundebene entfernen als sie es dann tun.

Darüber hinaus finde ich, dass die 3D Transforms auch in anderer Beziehung sehr eigenwillig definiert sind. Ich habe eins der 16 quadratischen Felder grün angemalt und um -40 Grad um die X-Achse gedreht (also "nach vorn" geklappt). Das Div, in dem die Felder angeordnet sind, habe ich um 40 Grad entgegengesetzt gedreht (also "nach hinten" geklappt). Ich würde erwarten, dass sich das grüne Feld dann wieder quadratisch darstellt, d.h. die beiden Transformationen sich aufheben. Das ist aber nicht der Fall. Wenn es kein Bug ist, dann ist es ein recht merkwürdiges Feature.

Rolf