我正在将我的项目从引导程序2迁移到引导程序3。现在,我在网格布局方面遇到了一些我无法理解的问题。我有一个col-md-12,我想在这个更大的div中添加3个等宽的列。逻辑上,这3列应分别为col-md-4。但是,当我添加类col-md-4的3列(divs)时,它们不合适,并且其中之一被压低,第二个之后的末尾还留有一些空间。请有人帮助我了解我可能会缺少的东西。谢谢你。
听起来好像是填充问题。嵌套col-xx-#
类时,Bootstrap会自动添加填充。如果您col-md-4
是col-md-12
引导程序的直接子代,则会添加填充,而您的第三个col-md-4
将以新行结尾。
你在做什么:
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="col-md-4">
1/3
</div>
<div class="col-md-4">
2/3
</div>
<div class="col-md-4">
3/3
</div>
</div>
</div>
</div>
要解决此问题,请class="row"
在您的第一个之上添加一个新内容,col-md-4
或简单地删除col-md-12
以下内容:
<div class="container">
<div class="row">
<div class="col-md-4">
1/3
</div>
<div class="col-md-4">
2/3
</div>
<div class="col-md-4">
3/3
</div>
</div>
</div>
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句