flex布局与position:absolute/fixed冲突问题
场景如上,同时使用flex布局和position:fixed
代码如下
#tabBar{ position: fixed; bottom: 0; .surround{ display: flex; justify-content: space-around; color: rgb(51,51,51); font-size: 20rpx; border-top: 2rpx solid rgba(226,226,226,0.9); padding-top: 20rpx;
解决方案:
给使用弹性布局的元素,外层使用父元素包裹,父元素使用position:fixed,并且使用left: 0, right: 0
代码如下:
#tabBar{ position: fixed; left: 0; right: 0; bottom: 0; .surround{ display: flex; justify-content: space-around; color: rgb(51,51,51); font-size: 20rpx; border-top: 2rpx solid rgba(226,226,226,0.9); padding-top: 20rpx;