このブートストラップの例では、サイズ変更時の位置合わせについて説明しています

Question

私はこのjsfiddleのブートストラップ形式とシンプルなラベル+テキストボックスコンボを持っています。

<div class="form-group"> 
    <label class="col-md-4 control-label" for="af_Email">Email</label> 
    <div class="col-md-4"> 
     <input id="af_Email" readonly="readonly" name="af_Email" 
      placeholder="" class="form-control input-md" 
      required="" value="frizzo@hotmail.com" type="email"> 
    </div> 
</div> 

ページが展開されている（COL-MD-*範囲内と仮定）、右揃えのラベルやマージンが優れているとページがよさそうです。

私は整列を左にラベル、* COL-MD-よりも低いものにページを縮小すると、パネルにマージンが存在しないで、それは専門外になります。

ページサイズがcol-md- *より小さい場合は、（パネルの両面に）余白を追加するにはどうすればよいですか？

誰かがこの動作が定義されているか文書化されているブートストラップのどこで説明できますか？

Answer 1

.col-md-12の前に.form-groupを追加していないようです。

更新日：https://jsfiddle.net/ttb0xtn0/1/