Twitter引導程序窗體字段格式

Question

標籤不與字段對齊。
如果超出列寬，我想確保標籤被優雅包裝。
下面是完整jsfiddle
HTML

<div class="row row-padded"> 
     <strong>Question: </strong><p>Are you 18 years old?</p> 
     <strong>Answer:</strong> 
     <div class="radio-inline"> 
      <label><input type="radio" name="optionsRadios" id="optionsRadios1" value="option1">Yes</label> 
     </div> 
     <div class="radio-inline"> 
      <label><input type="radio" name="optionsRadios1" id="optionsRadios2" value="option1">No</label> 
     </div> 
     <div class="row"> 
      <div class="col-md-8 childFields"> 
      <p class="">Give full details here: </p> 
      <div class="row"> 
       <div class="col-md-6 colChildFields"> 
       <label>Nature of Condition</label> 
       <input type="text" name="city"/> 
       </div> 
       <div class="col-md-6 colChildFields"> 
       <label>Dates and Duration</label> 
       <input type="text" name="city"/> 
       </div> 
       <div class="col-md-6 colChildFields"> 
       <label>Name Of Doctor</label> 
       <input type="text" name="city"/> 
       </div> 
       <div class="col-md-6 colChildFields"> 
       <label>Name of Hospital</label> 
       <input type="text" name="city"/> 
       </div> 
       <div class="col-md-6 colChildFields"> 
       <label>Address of Hospital</label> 
       <input type="text" name="city"/> 
       </div> 
      </div> 
      </div> 
     </div> 
    </div> 

Answer 1

我不知道我理解你的權利，但如果that是你在找什麼，你應該只添加此的CSS：

.col-md-6 label { 
    width: 150px; 
} 

Answer 2

如果你想要做一個橫向的形式，你必須使用一個div容器與form-group類，並添加一個類control-label的標籤，form-control的輸入，像這樣的結構：

<form class="form-horizontal" role="form"> 
    <div class="form-group"> 
    <label for="inputEmail1" class="col-lg-2 control-label">Email</label> 
    <div class="col-lg-10"> 
     <input type="email" class="form-control" id="inputEmail1" placeholder="Email"> 
    </div> 
    </div> 
    <div class="form-group"> 
    <div class="col-lg-offset-2 col-lg-10"> 
     <button type="submit" class="btn btn-default">Sign in</button> 
    </div> 
    </div> 
</form> 

更換（在班）-lg-通過-xs-，這將是如果標籤不再響應和自我管理。

見有例如我jsFiddle