栅格系统间隙问题总结

当我们使用组件的栅格系统时
< Row>
< Col span={8}>
123
< /Col>
< Col span={8}>
456
< /Col>
< Col span={8}>
789
< /Col>
< /Row>
由于每一个Col都是8,加起来刚好是24 如果此时想要给两个Col之间加点间隙的话,
加margin则会超出Row的最大宽度,出现的结果就是 最后一个Col会另起一行展示,
解决方法:
给每一个Col里面再加一个div 给div设置需要的高度 宽度视情况而定 如果不设置 则会继承Col的宽度 即100%;
如果设置宽度,用百分比设置最好;
然后给div设置padding-right
由于有默认的padding-left值 所以可以有选择性的去掉padding-left;
这样 既满足栅格系统保持自适应 又不会因宽度太大而塌陷;

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值