今天在做弹层时发现fixed在火狐上不能正确居中,后发现不是positon的问题而是,margin-top的%算发不一样。并且
transform-style: preserve-3d;使position:fixed属性失效(3d变形后就会出现fixed的高度出现问题)
DEMO
<div style="position:relative;margin: 0 auto;width: 500px;position:relative;background: red;height: 2000px;"> <div style="position: fixed;height: 100%;width:100%;background: blue;"> <div style="position: fixed;background: black;width: 500px;height: 200px;margin-left: 50%;margin-top: 50%;"> </div> </div> </div>
最后用js计算高度实现了或者去除transform-style解决了