transform 实现响应式绝对居中

<div class="center">您可以尝试改变浏览器大小，这个元素依然是水平垂直居中的哦！</div>

.center{
　　position: absolute;
　　top: 50%;
　　left: 50%;
　　width:50%;
　　height:30%;
　　padding:20px;
　　text-align:center;
　　background:#393;
　　color:#fff;

-webkit-transform: translate(-50%, -50%);

-moz-transform: translate(-50%, -50%);

-ms-transform: translate(-50%, -50%);

-o-transform: translate(-50%, -50%);

transform: translate(-50%, -50%);

}