我使用简单:
<div class="row">
<div class="col-11"></div>
<div class="col-1"></div>
</div>
在.container-fluid
div 中,我想知道为什么当宽度低于 623px
我想弄明白,因为我不想在我的项目中发生这种情况。
有人对此有所了解吗?
这是一个codepen.io版本来检查它。
答案 0 :(得分:2)
在你的codepen上,这是因为&#34;对&#34;对于col-1来说,这个词很重要。
答案 1 :(得分:1)
那是因为&#34;对&#34;当窗口达到该大小时,它不适合col-1
列。因此,它会溢出,这就是水平滚动条出现的原因。
要解决此问题,您可以使用col-auto
代替col-1
。
col-auto
会使列尽可能地缩小,以便适合列中的内容。这也意味着,在这种特殊情况下,列只会被推下(当它不合适时),你就不会得到任何水平滚动条。