Html 防止div在引导中缠绕

我正在使用引导来帮助构建网页。在一行中，我有三个并排的div，宽度为：2列、6列和4列，按照12列布局的顺序排列

中间的div还设置了最小宽度，因此当最外层的div收缩超过某个宽度时，最右侧的div（4列的一个）没有足够的空间，因此它会环绕并悬挂在其他div的下方

我想防止这个div缠绕，当屏幕收缩得太小时，迫使它被窗口切断。我将如何做到这一点

如有必要，我可以提供任何进一步的细节/代码/图片

谢谢

---

防止换行：将此项添加到行中

.row{
  width:100%;
  margin:0;
  padding:0;
  display:flex;
}

宽度：100%；保证金：0；填充：0在本例中是可选的

这可能会导致您的内容拉伸到最大高度，因此不要直接将内容放入引导列（例如，`col-md-6等等）。在其中放一个div，并将内容放在该div中

像这样：

<div class="col-xs-2">
  <div class="contentDiv">
    <!--Put your content here-->
  </div>
</div>


如果您可以使用fiddle/snippet向我们展示场景，或者添加任何填充，那就太好了？这三个div是否与.row一起包装在一个div中？@AndrewIce这些div是否包装在一个容器中，您的最小宽度可能会导致此断裂。display flex将有助于解决这个问题，但老实说，如果您的目标是拥有一个响应性屏幕，则不建议这样做。列是基于百分比的。如果您的中间列超出了该宽度，DOM别无选择，只能向下推下一个元素。@AndrewIce有什么建议吗？嗯，这似乎会导致div在最小宽度确定后重叠。您需要将
class=“clearfix”
添加到bootstrap divs（例如
col-md-2
等等）中，这样就行了！有点乱，但它照你说的做了。谢谢