不幸的是,似乎没有一种好的方法来管理在某些断点处从水平堆栈过渡到垂直堆栈的列之间的垂直间距.在涉及表单时似乎确实存在解决方案,但这不是这里的情况.我已经尝试过这个解决方案,但是当有多个列连续换行时它不起作用.
为了说明我的场景,这是我的HTML结构:
<body>
<div class="container">
<div class="row">
<div class="col-md-4">
col 1
</div>
<div class="col-md-4">
col 2
</div>
<div class="col-md-4">
col 3
</div>
<div class="col-md-4">
col 4
</div>
<div class="col-md-4">
col 5
</div>
<div class="col-md-4">
col 6
</div>
</div>
</div>
</body>
https://jsfiddle.net/b74a3kbs/6/
在中等设备尺寸(md)及以上,我希望那里有两列"行"之间的间距,但是在3列的"第一行"之上没有间距而在"第二行"之下没有间距. 3列.当列垂直堆叠在中等设备大小(md)下方时,我希望每个列之间有间距,但没有列在第一个子节点之上,没有一个在最后一个子节点之下.
理想情况下,无论行中包含多少列(例如,3,5,6,12),该解决方案都可以工作.