为何使用了 css3 translate3d 会导致显示模糊？

弹出框使用了

  -webkit-transform: translate3d(-50%, -50%, 0);

来使弹出框垂直居中。，但是弹出框变模糊了。
弹出框的样式为

.pop-alert {  position: fixed;  left: 50%;  top: 50%;  -webkit-transform: translate3d(-50%, -50%, 0);  transform: translate3d(-50%, -50%, 0);  z-index: 999;  min-width: 400px;  border: 4px solid rgba(0,0,0,.5);  background-color: #fff;  padding: 5px;  text-align: left;}