ブートストラップのcol - * - *クラスを入力要素に入れても構いませんか？

Question

私はブートストラップを使用してレスポンシブフォームを作成しようとしています。 COLを使用することが正しいです - ** - このような*クラス：

<div class="row"> 
    <input class="col-*-blabla" ... ... > 
    <input class="col-*-blabla" ... ... > 
</div> 

またはIこのようなコルクラスを持つdiv要素の内部にネストしてください。

<div class="row"> 
    <div class="col-*-*"> 
    <input .. ... > 
    </div> 
    <div class="col-*-*"> 
    <input .. ... > 
    </div> 
</div> 

はありがとうございます。

Answer 1

これらはネストしてください。ラベルの要素（Horizontal forms）にcol-クラスの使用を示すブートストラップのドキュメントの1つの例があります。この例では

見てあなたは、彼らがずれてます入力要素にcol-クラスを使用するときに、このコンテナの下に見ることができるように、赤いブロックは、row内部のデフォルトcol-xs-12クラスを持つdiv要素である（それは入力要素にパディングを適用するためです自体）。

.div { 
 
    height: 200px; 
 
    background: red; 
 
} 
 
.row { 
 
    margin-bottom: 20px; 
 
}

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

 
<div class="container"> 
 
    
 
    <div class="row"> 
 
    
 
    <div class="col-md-12"> 
 
     <div class="div"></div> 
 
    </div> 
 
    
 
    </div> 
 
    
 
    <div class="row"> 
 
    <input type="text" class="col-xs-4"> 
 
    <input type="text" class="col-xs-4"> 
 
    </div> 
 
    
 
    <div class="row"> 
 
    <div class="col-xs-4"> 
 
     <input type="text"> 
 
    </div> 
 
    <div class="col-xs-4"> 
 
     <input type="text"> 
 
    </div> 
 
    
 
</div>