ブートストラップ4アルファ6のフォームを整列させますか？

Question

Bootstrap 4の新しいAlpha 6アップデートでは、フォームのアライメントがいくつかの新しいクラスに依存しているようですが、CSS内のdisplay：blockクラスで.mx-autoクラスを追加しようとしましたが、

これは私が持っているコードです。どのように画面の中央に単純な形を得ることができるかについて誰にも光を当てることができますか？

<section id="form"> 
    <div class="container"> 
     <div class="row"> 

       <div class="col-md-12"> 
        <form class="form-inline" role="form" method="post"> 
         <input type="email" class="form-control form-control-sm" name="email" placeholder="enter your email"> 
         <button type="submit" class="btn btn-signup" name="submit" value="send">sign up</button> 
        </form> 

       </div> 

     </div> 
    </div> 
</section> 

これはAlpha 5で動作していたCSSです。これで、テキストの配置が機能しなくなったことが分かりました。ブートストラップ4の新しいアルファ6アップデートで

#form { 
    text-align:center; 
    color:white; 
} 

Answer 1

「フォームインライン」クラスは、値「フレックス」と表示性の新たな宣言を取得します。

フォームを中央に持って来るには、 "ブロック"に設定する必要があります。

.form-inline{ 
    display: block; 
} 

これはあなたの問題を解決します。感謝:)

Answer 2

フォームにjustify-content-centerクラスを追加します。この問題を解決し

<section id="form"> 
    <div class="container"> 
    <div class="row"> 
     <div class="col-md-12"> 
     <form class="form-inline justify-content-center" role="form" method="post"> 
      <input type="email" class="form-control form-control-sm" name="email" placeholder="enter your email"> 
      <button type="submit" class="btn btn-signup" name="submit" value="send">sign up</button> 
     </form> 
     </div> 
    </div> 
    </div> 
</section>