Bootstrap 4使表单的一部分与标签或字段集内联

Question

我正在尝试水平形式的3个字段（其余字段将被堆叠）。

然而，从文档中不清楚如何安排字段的标签。 （它们不是使用标签的文档中的示例）。

这里我试图让一个标签覆盖所有三个字段，非常高兴使用前两个标签（而另外两个字段没有标签）或者使用字段集标签。

我已经这样做了，但标签似乎浮动得太高，

https://codepen.io/anon/pen/zPWZzm

three digits and two letters

Answer 1

我已经向该字段集添加了一个fieldset-inline类（而不是form-inline类），并且将表单组的显示覆盖为inline-block。

.fieldset-inline {
  display: flex;
  flex-flow: row wrap;
  align-items: center;

  @include media-breakpoint-up(sm) {
    .form-group {
      display: inline-block;
      align-items: center;
      margin-bottom: 0;
    }
  }
}