2016-03-22 20 views
1

私の選択したドロップダウンを自分の入力フィールドにブートストラップで水平に整列しようとしています。しかし、それはこれまで働いていない。私はこのために<fieldset class="inline-fields">を使用しました。これは私が欲しいものです:ブートストラップを使用して選択ドロップダウンを入力フィールドに合わせる

ここ

enter image description here

あなたがplunkerを見つけることができます: https://plnkr.co/edit/PtW626uq9jkLCbBLR9Xc?p=preview

+0

col-md-クラスを使用して水平空間を分散する – Bardo

答えて

1
<fieldset class="inline-fields"> 
    <label>search</label> 
     <p>Find all:</p> 
     <div class = "row col-sm-12"> 
      <div class = "row col-sm-6 col-md-6"> 
       <select class="form-control" id="column_select"> 
        <option value="1">1</option> 
        <option value="2">2</option> 
        <option value="3">3</option> 
        <option value="4">4</option> 
        <option value="5">5</option> 
       </select> 
      </div> 
      <div class = "row col-sm-6 col-md-6"> 
       <label for="keten2"></label> 
       <input type="text" class="form-control" id="keten2" placeholder="Voer de naam van" name="keten2"></input> 
       <br/> 
      </div> 
     </div> 
    </fieldset> 

は、上記のように、ブートストラップクラスを追加します。私のために働いた。

ブートストラップチュートリアルを実行し、ブートストラップグリッドシステムを理解してください。クラス行と本部で

1

ラップ両方のコントロール

<div class="row"> </div> 

はその後に個別のコントロールの両方をラップしてみてください。

<div class="col-xs-6"> </div> 

理解のブートストラップ・グリッドを支援するための優れたリソースがW3Schoolsのです。 http://www.w3schools.com/bootstrap/bootstrap_grid_basic.asp

希望に役立ちます。

関連する問題