Bootstrap 4 Boostrap 4中的Flex布局

我试着做一个列布局，将每个单元格放置在另一个单元格的右边，直到它达到容器的宽度。然后，下面的其他div应继续在下一行渲染，依此类推

到目前为止，我看到的所有示例都是这样做的：

<div class="container">
  <div class="row">
    <div class="col-sm">
      One of three columns
    </div>
    <div class="col-sm">
      One of three columns
    </div>
    <div class="col-sm">
      One of three columns
    </div>
  </div>
</div>

所有示例都使用了一个类为row的容器，但是，我不需要它，因为我不知道在容器宽度中可以容纳多少列

是否有一种方法可以使列自动向右排序

例如，类似于：

<div style="float: left">...</div>
<div style="float: left">...</div>
<div style="float: left">...</div>
<div style="float: left">...</div>

---

但是使用Boostrap 4。每个div包含带有标签和输入字段的form_组。

您可以通过向基本行和col-*-*结构添加一些类来获得所需的输出；要将每一列向右对齐，只需向行添加一个justify content结束类，因为行具有display:flex属性，所以可以将所有flex行为应用于行；这样，如果有可用空间，列将被推到右侧

另外，如果您想反转列的顺序，还可以添加一个类flex row reverse，顾名思义，它将在行内以相反的顺序呈现列

工作示例

---

在行div上，添加类justify content end或flex row reverse；如果我理解正确，那应该对你有帮助，让我知道！我不明白问题是什么。具体来说，示例使用了一个类为row的容器，但是，我不需要它，因为我不知道容器宽度中可以容纳多少列是没有意义的。这样我就需要知道一行中可以容纳多少元素。我用d-flex类添加了一个div，所有元素都放在一行中，添加了一个水平滚动条来查看所有其他元素。如果容器网格只允许2个元素，我需要将这2个元素和另一个元素显示到下一行，这样您就可以在该行中放置任意数量的列，它们将根据需要换行到下一行needed@IvanS95谢谢那个密码有效。。。。我已经添加了2个容器div，一个包含容器流体类，另一个包含行内容结束类。。。。在它里面，我添加了元素，它们被渲染成我想要的样子。