即10 css 3d变换表现不同

Question

我试图实现＆＃34; translateZ＆＃34;在IE10预览中转换功能并遇到了一个问题。

所以只有＆＃34;直接＆＃34;它才能正常工作。转换节点的父节点具有＆＃34; -ms-perspective＆＃34;如果父母的父母已经获得了＆＃34; -ms-perspective＆＃34;物业设置。

任何人都可以建议这是一个错误，如果有解决方法。 例如，如果在以下代码中我适用＆＃34; -ms-perspective＆＃34;它不起作用。 to＆＃34; div1＆＃34;并在div3上尝试rotateZ。

<div class="div1">
    <div class="div2">
        Parent
        <div class="div3">
            Child
        </div>
    </div>
</div>

Answer 1

在Internet Explorer 10.0.8400.0中，它似乎对我很好用：

<div class="div1">
    <div class="div2">
        Parent
        <div  class="div3">
            Child Rotated
        </div>
    </div>
</div>

以下CSS：

.div1 {
    margin: 25px 100px;
    background: #f1f1f1;
    -ms-perspective: 500px;
}

.div3 {
    width: 100px;
    height: 100px;
    background: orange;
    -ms-transform: rotateZ(30deg);
}

产生以下效果：

小提琴：http://jsfiddle.net/jonathansampson/NKZw6/