Currently, I am utilizing CSS3 for a transformation on a div with the following properties:
'-webkit-transform' : 'rotateX(45deg) rotateZ(-45deg)'
The outcome appears like this:
Alternatively, you can view it in action in this fiddle: http://jsfiddle.net/kteSW/
Observing the result, the angle measures 36 degrees, which is different from the expected 30 degrees (sin45*sin45). I am curious if anyone knows why this discrepancy exists. Could it be an intentional design choice or perhaps a CSS3 bug?
UPDATE:
I have already configured the settings to be:
-webkit-transform-style: preserve-3d;
-webkit-perspective: none;
With these parameters in place, the transformation should render in an orthogonal manner. However, the angle remains at 36 degrees instead of the desired 30 degrees.