css - CSS 卡翻转器不会在 Internet Explorer 中显示回来

Question

我四处寻找解决这个问题的方法，但还没有找到。我有可在 Chrome 和 Firefox 中使用的个人资料卡，但在 Internet Explorer 中我仍然无法显示。这是codepen，这是CSS代码：

body {
background: #f5f5f5;
color:#999;
font-size:12px;font-weight:bold;
font-family: 'Open Sans', 'Trebuchet MS', sans-serif;
margin: 2em;
}
.body_m {background:rgba(156,74,59,0.8);}
img {border-radius:50%; height:150px;box-shadow: 0px 0px 0px #ee9b05;}
.sub { width:100%; position:absolute; background:#b8b543; height:30px; text-align:center;color:white; padding-bottom:15px;font-size:16px; line-height:8pt;font-weight:bold; margin-top:14px; }
#titulo { width:100%; position:absolute; background:white; height:30px; text-align:center;color:#ee9b05; padding-top:10px;padding-bottom:0px;font-size:18px;line-height:13pt; font-weight:bold;}
#title {width:100%; position:absolute; text-align:left;color:black; font-size:11px; font-weight:bold;}

.flip-container {
margin: 0 auto;
-webkit-perspective: 1000;
-moz-perspective: 1000;
}

.flip-container:hover .flipper {
-webkit-transform: rotateY(180deg);
-moz-transform: rotateY(180deg);
-ms-transform: rotateY(180deg);
}

.flipper {
background:#fff;
-webkit-transition: 0.6s;
-webkit-transform-style: preserve-3d;
-webkit-backface-visibility: hidden;
-moz-transition: 0.6s;
-moz-transform-style: preserve-3d;
-moz-backface-visibility: hidden;
-ms-transition: 0.6s;
-ms-transform-style: preserve-3d;
-ms-backface-visibility: hidden;
position: relative;
}

.front, .back {border-radius: 9px;
box-shadow: 0px 0px 20px #111111; 
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
position: absolute;
top: 0;
left: 0;
}

.front {
text-align:center;
padding-top:20px;
padding-bottom:0px;
background:white;
z-index:1
}

.flip-container, .front, .back {
width: 17.5em;
height: 19.5em;
}

.back {
background:#b8b543;
padding-top:20px;
padding-bottom:0px;
-webkit-transform: rotateY(360deg);
-moz-transform: rotateY(360deg);
-ms-transform: rotateY(360deg);
}

.back p {
margin-left:15px;
margin-right:15px;
color: white;font-weight:300;
}

/*blur*/

.blurry {
-webkit-filter: blur(7px);
filter: blur(7px);
-webkit-transform: translateY(0px)
                 translate3d(0,0,0);
}