Internet Explorer CSS中的Transform-Style reserve-3d无法正常工作

I got a website Working in Opera Chrome and Firefox but it gets messed up with the preserve-3d feature in Internet Explorer.Is there a way to fix this just for the internet explorer css code and leave the other browsers code as it is right now?I hope thats possible.Css:.back img{ max-width: 90%; height: auto; margin: 1em; overflow: hidden;}.front{ margin-top: 0.2em; height: 100%; width: 100%; line-height: 1.2; margin-left: 0.2em; margin-right: 0.2em;}/*Container flip*//* flip the pane when clicked */.flip .flipper, .flip-container.hover .flipper, .flip-container.flip .flipper { transform: rotateY(180deg); -ms-transform: rotateY(180deg);}/* flip speed goes here */.flipper { transition: 0.8s; transform-style: preserve-3d;}/* hide back of pane during swap */.front, .back { backface-visibility: hidden; top: 0; left: 0;}/* front pane, placed above back */.front { /* for firefox 31 */ transform: rotateY(0deg); -webkit-transform: rotateY(0deg); position:absolute; margin-top: 1.2em; margin-bottom: 1.2em; margin-left: 20px; overflow: auto; word-break: normal; width: 90%; color: black;}/* back, initially hidden pane */.back { transform: rotateY(180deg);}HTML:<div class="flip-container flip"> <div class="flipper"> <div class="back"> <img src="imgsource.png"> </div> <div class="front"> <p>Some text</p> </div> </div></div><div class="flip-container flip"> <div class="flipper"> <div class="back"> <img src="imgsource.png"> </div> <div class="front"> <p>Some text</p> </div> </div></div><div class="flip-container flip"> <div class="flipper"> <div class="back"> <img src="imgsource.png"> </div> <div class="front"> <p>Some text</p> </div> </div></div>IF you click on the .flip-container class the .flip class gets removed and the textbox will show up with a nice effect. This doesnt work in Internet Explorer.Thanks for helping! 解决方案 It Aleksander Bavdaz, provides the answer and the fix here:Unfortunately IE already uses the non-prefixed properties, so you either can't use transform-3d at all or have to define the prefixed properties last.CSS3 3D Transform doesn't work on IE11 这篇关于Internet Explorer CSS中的Transform-Style reserve-3d无法正常工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！