CSS3旋轉變換

Question

給定以下提琴，如何使紅色矩形在垂直平面上直立？

http://jsfiddle.net/paulsidebottom/vEWEL/

我嘗試更改標記的旋轉變換，但它似乎圍繞同一軸旋轉。

    #marker
    {   
      -webkit-transform:rotateY(-50deg);

Answer 1

您需要在其父級上保留3d轉換：

    .threeD
    {
         -webkit-transform-style: preserve-3d;
         -webkit-transform: rotateX(55deg);
         -webkit-transition: all .5s ease-in-out;
         position:relative;
    }