ブートストラップ3入力グループ

Question

今私はブートストラップ3入力グループで作業していますが、結果は期待通りです。 私はselect [input] - [input text] - [button]を1行にします。 私の場合はボタンの中にこのような空白があります Input Group SS。 これは私のコードです：

<div class="card-block bg-white"> 
 
     <div class="row"> 
 
     \t <form action="<?php echo base_url(); ?>performance" method="post"> 
 
      <div class="form-group"> 
 
      \t <div class="input-group col-md-6 col-md-offset-4 col-sm-12 col-xs-12"> 
 
       \t <span class="input-group-btn"> 
 
       \t <select class="form-control input-sm" name="id_cabang" id="id_cabang"> 
 
          <option>Option 1</option> 
 
          <option>Option 2</option> 
 
          <option>Option 3</option> 
 
        </select> 
 
        </span> 
 
        <span class="input-group-btn"> 
 
        \t <input id="bulan_kinerja" name="bulan_kinerja" type="text" class="form-control input-sm bln_picker" data-provide="datepicker" placeholder="Datepicker" value="<?php echo $bulan_kinerja; ?>"/> 
 
        </span> 
 
        <span class="input-group-btn"> 
 
        <button type="submit" class="btn btn-primary btn-sm" id="kinerja_btn">Submit</button> 
 
        </span> 
 
       </div> \t 
 
      </div> \t 
 
      </form> 
 
     </div> 
 
    </div>

私はグーグルで、いくつかの例を試してみましたが、画面幅が小さく変化した場合、いくつかのケースは、それが新しい行になります。

私は結果が応答性の幅と完全なブートストラップ3クラスを使用して欲しいです。助けてください。本当にありがとう。

Answer 1

あなたは常に最新のバージョンを使用する必要があります

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" > 
 
<div class="card-block bg-white"> 
 
    <div class="row"> 
 
    \t <form action="<?php echo base_url(); ?>performance" method="post"> 
 
     <div class="form-group"> 
 
     \t <div class="input-group col-md-6 col-md-offset-4 col-sm-12 col-xs-12"> 
 
      \t <span class="input-group-btn"> 
 
      \t <select class="form-control input-sm" name="id_cabang" id="id_cabang"> 
 
         <option>Option 1</option> 
 
         <option>Option 2</option> 
 
         <option>Option 3</option> 
 
       </select> 
 
       </span> 
 
       <span class="input-group-btn"> 
 
       \t <input id="bulan_kinerja" name="bulan_kinerja" type="text" class="form-control input-sm bln_picker" data-provide="datepicker" placeholder="Datepicker" value="<?php echo $bulan_kinerja; ?>"/> 
 
       </span> 
 
       <span class="input-group-btn"> 
 
       <button type="submit" class="btn btn-primary btn-sm" id="kinerja_btn">Submit</button> 
 
       </span> 
 
      </div> \t 
 
     </div> \t 
 
     </form> 
 
    </div> 
 
</div>

を使用してブートストラップCSSスタイルシートを含める必要があります。 v4に移行する方法についてはhereをご覧ください。