ブートストラップ・モーダル・フォーム・インラインは「インライン」ボタンではありません

Question

私は本当にこの問題に固執しています。

<div id="loginModal" class="modal fade" role="dialog"> 
    <div class="modal-dialog"> 
    <!-- Modal content--> 
    <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal">&times;</button> 
      <h4 class="modal-title">Login </h4> 
     </div> 
     <div class="modal-body"> 

      <div class="form-inline"> 

       <div class="form-group"> 
       <label class="sr-only" for="email">Email Address</label> 
       <input type="email" class="form-control-input-sm text-center" placeholder="Email"> 
      </div> 
      <div class="form-group"> 
       <label class="sr-only" for="password">Password</label> 
       <input type="password" class="form-control-input-sm text-center" placeholder="Password"> 
      </div> 
       <input type="checkbox"><span style="color:#9d9797">Remember me</span> 

       <button type="submit" class="btn btn-info">Sign In</button> 
       <button type="button" class="btn btn-default btn-sm" 
        data-dismiss="modal">Cancel</button> 
      </div>    
     </div> 
    </div> 
    </div> 
</div> 

それの写真：

Answer 1

デフォルト入力のmax-width次のモーダル.FORM-インラインを作成したが、キャンセルボタンがインラインの外にとどまり、これはコードです280pxである、あなたは、入力テキストボックス

にそれを適用するように

<style> 
    .input-short { 
     max-width: 130px !important; 
    } 
</style> 

として、それを減少させるクラスを定義することができます

<input type="email" class="form-control input-short" id="email" placeholder="Email"> 

これはあなたに必要なものを与えます（それに応じて最大幅を調整します）。