transform-style: preserve3d не работает в Firefox и IE

Question

Я использую transform-style: preserve3d, чтобы создать флип-анимацию. Однако эта анимация только 3-мерная в Chrome, а не в Firefox или IE 10. В этих двух браузерах она плоская.

jsFiddle: http://jsfiddle.net/ZQf9j/

HTML

<ul> 
    <li>TEST</li> 
</ul> 

CSS

ul 
{ 
    -webkit-perspective: 600; 
    -webkit-transform-origin: 50% 50%; 
    -moz-perspective: 600; 
    -moz-transform-origin: 50% 50%; 
} 
ul li 
{ 
    display: inline-table; 
    width: 100px; 
    height: 100px; 
    margin: 5px; 
    border: 1px solid black; 
    -webkit-transform: rotateY(45deg); 
    -webkit-transition: all 500ms; 
    -moz-transform: rotateY(45deg); 
    -moz-transition: all 500ms; 
} 

Вопрос

Как я могу сделать поворот 3d в Firefox и IE не только в Chrome?

Answer 1

Добавить ПЙ

-webkit-perspective: 600px; 
-moz-perspective: 600px; 
-ms-perspective: 600px; 
perspective: 600px;