html - 在 Bootstrap 网格中对齐文本区域和按钮

Question

如何在 bootstrap 12 网格系统中将 textarea 和 button 并排对齐？另外，我的按钮底部有令人讨厌的几英寸上升。

我试过:

• 边距:0 自动；

• 显示: flex ；

• 对齐元素:居中；

• justify-content: center;

• 显示:内联 block

    .center-div-content {
      display: flex;
      align-items: center;
      justify-content: center;
    }

          <div class="col-md-8">
            <input type="text" class="form-control" aria-describedby="sizing-addon1" placeholder="ENTER PROMO CODE">
          </div>
          <div class="col-md-4 center-div-content">
            <input type="submit" class="btn color-white mwc-orange-background-color" name="redeem" value="REDEEM">
          </div>

Answer 1

使用 form row :

<form>
  <div class="form-row">
    <div class="col">
        <input type="text" class="form-control" aria-describedby="sizing-addon1" placeholder="ENTER PROMO CODE">
    </div>
    <div class="col">
        <input type="submit" class="btn color-white mwc-orange-background-color" name="redeem" value="REDEEM">
   </div>
  </div>
</form>

https://jsfiddle.net/9b8meg3q/