css transform定位,css transform（）弹出窗口问题的中心定位

HTML

Some header

Some bunch of content etc

CSS

.__holder {

position: fixed;

z-index: 15000;

top: 0;

right: 0;

bottom: 0;

left: 0;

width: 100%;

height: 100%;

background-color: rgba(0,0,0,.5);

}

.__box {

position: absolute;

z-index: 16000;

top: 50%;

left: 50%;

-webkit-box-sizing: border-box;

-moz-box-sizing: border-box;

box-sizing: border-box;

margin-right: -50%;

padding: 0;

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

-webkit-border-radius: 6px;

-moz-border-radius: 6px;

border-radius: 6px;

background-color: #fff;

-webkit-box-shadow: 0 0 18px 3px rgba(0, 0, 0, .07);

-moz-box-shadow: 0 0 18px 3px rgba(0, 0, 0, .07);

box-shadow: 0 0 18px 3px rgba(0, 0, 0, .07);

padding: 29px;

}

渲染的唯一问题：取决于浏览器窗口的缩放级别，有或者水平或垂直边不锐利，在2像素之间平滑/模糊...(chrome版本39.0.2171.95 m

，firefox 34.0.5)这是一个例子(窗口的左右两边平滑)：

我发现它是transform: translate(-50%, -50%)行的责任。

有人遇到过同样的问题吗？任何解决方案？