<style>
*{margin: 0;padding: 0;}
.flex-box{
display: flex;
justify-content: center;
align-items: center;
width: 100vw;
height: 100vh;
}
.box{
flex: 0 0 auto;
position: absolute;
width: 50vw;
height: 50vh;
background: red;
}
</style>
<div class="flex-box">
<div class="box"></div>
</div>
在PC chrome的结果是
微信图片_20171106161725.png
ios的表现
微信图片_20171106161747.jpg
所以, 使用flex布局的时候需要最好不要搭配absolute 来实现居中效果, 还是多一个div来实现嵌套吧
在做部门招新页面的时候被坑过一下, 记录一下
12/25号更新
margin: 0 auto; 也有类似的问题
网友评论