flex布局下关于padding导致视图容器塌陷的解决方案


在flex布局下,不可直接将padding值如同margin一样设置:

👇这是不正确的写法

.box{
     box-sizing: border-box;
     padding: 0 40rpx;
     margin: 0 auto;
}

解读:开发者本意是想将box左右居中显示,但是这样会导致box右边无法居中,根源在于使用了padding: 0 40rpx;

👇正确示范

.box{
     box-sizing: border-box;
     //如果想左右都有padding,需要分开写
      padding-left:40rpx;
      paading-right:40rpx;
     margin: 0 auto;
}

不知道原因,但是这样的确可以解决塌陷问题。

**我也有一脑袋的小问号 **


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM