221

フォームのみが存在するページがあり、フォームを画面の中央に配置したいと考えています。

<div class="container">
  <div class="row justify-content-center align-items-center">
    <form>
      <div class="form-group">
        <label for="formGroupExampleInput">Example label</label>
        <input type="text" class="form-control" id="formGroupExampleInput" placeholder="Example input">
      </div>
      <div class="form-group">
        <label for="formGroupExampleInput2">Another label</label>
        <input type="text" class="form-control" id="formGroupExampleInput2" placeholder="Another input">
      </div>
    </form>   
  </div>  
</div>

はjustify-content-centerフォームを水平に揃えますが、垂直に揃える方法がわかりません。と を使用しようとしましalign-items-centerたalign-self-centerが、機能しません。

私は何が欠けていますか？

デモ

4

17 に答える 17

2

これは、Bootstrap 4.3を使用するIE 11で機能しています。私の場合、他の答えはIE11では機能しませんでした。

 <div class="row mx-auto justify-content-center align-items-center flex-column ">
    <div class="col-6">Something </div>
</div>
于 2019-11-07T17:52:40.303 に答える