oppo R7不支持transform:translateX(-50%)，前缀都带了，没用？

Question

如题，fixed定位的div，top:50%,left:50%,transform:translate(-50%,-50%),其他手机，都好的，oppoR7居然不居中，是不支持translate？

Answer 1

我觉得并不是R7不支持translateX。不信你可以写一个纯粹的居中单例然后在R7上看，我能说100%是没问题的。
大胆猜测你的问题是js调用弹层后出现的弹窗不居中。解决方案（hack）可以考虑使用translate3d(-50%,-50%,0)代替translate(-50%,-50%)。
另一个思路是，给弹窗添加一个蒙层，蒙层用fixed定位，弹窗用absolute定位，然后代码照旧。如下：
/*蒙层*/
.alert{
position:fixed;
width:100%;
height:100%;
top:0;
left:0;
}
/*窗口*/
.alert_box{
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%)
}
                            

Answer 2

如果是特定手机不能居中定位的话，那可能就是兼容性问题了，或者换一种布局方式，移动端可以用flex布局，也很容易实现居中。要不就是识别手机，用js控制，如果是R7，就单独处理。不过先要确定是兼容性问题还是其他意外情况