html - Bootstrap 4 自定义复选框与文本输入格式相同？

Question

我有这样的 Bootrap 4 文本输入

<div class="col-2 form-group">
    <label for="follow">Följande</label>
    <input type="text" class="form-control" id="follow" name="Follow" placeholder="" value="" required>
    <div class="invalid-feedback">
        Vänligen fyll i Följande.
    </div>
</div>

而且我希望复选框标签与文本输入具有相同的垂直级别，并且选中与文本输入具有相同的垂直级别和大小。我曾尝试交换输入和标签代码，但没有任何效果。

带有自定义复选框的复选框代码。

<div class="custom-control custom-checkbox">
  <input type="checkbox" class="custom-control-input" id="customCheck1">
  <label class="custom-control-label" for="customCheck1">Check</label>
</div>

I have it like this

But want it like this

Answer 1

您应该将您的箱子妥善包裹在一个容器中

<div class="container">
  <div class="row">
    <div class="col-sm-4 form-group">
      <label for="follow">Följande</label>
    <input type="text" class="form-control" id="follow" name="Follow" placeholder="" value="" required>
    <div class="invalid-feedback">
        Vänligen fyll i Följande.
    </div>
    </div>

    <div class="col-sm-4 form-group">
    <label for="follow">Check</label>
    <div class="custom-control custom-checkbox">
    <input type="checkbox" class="custom-control-input" id="customCheck1">
    <label class="custom-control-label" for="customCheck1"></label>
    </div>
    </div>

     </div>
  </div>