Bootstrap表單標籤不放在文本框之前？

我不明白爲什麼下面的代碼將標籤放在文本框的右側而不是左側？我應該在<div class="form-group">附近使用<div class="row">嗎？Bootstrap表單標籤不放在文本框之前？

任何人都知道我錯過了什麼？

<div class="form-horizontal"> 
    @using (Html.BeginForm("EditClockGroup", "Admin", FormMethod.Post, new { enctype = "multipart/form-data" })) 
    { 
     @Html.ValidationSummary(false, "", new { @class = "alert alert-danger" }) 

     @Html.HiddenFor(model => model.GroupId, null) 

     <div class="form-group"> 
      @Html.LabelFor(m => m.GroupId, new { @class = "col-md-2 control-label" }) 
      @Html.TextBoxFor(m => m.GroupId, new { @class = "col-md-7 form-control" }) 
     </div> 

     <div class="form-group"> 
      @Html.LabelFor(m => m.GroupName, new { @class = "col-md-2 control-label" }) 
      @Html.TextBoxFor(m => m.GroupName, new { @class = "col-md-7 form-control" }) 
     </div> 

     <div class="form-group"> 
      <div class="col-md-7 col-md-offset-2"> 
       <input type="submit" value="Update" class="btn btn-primary" /> 
      </div> 
     </div> 
    } 
</div>

來源

2017-03-15 Caverman

在「控件大小調整」部分的窗體的引導文檔中，您應該看[這裏]（http://getbootstrap.com/css/#forms-control-sizes）。您應該查看「水平表單組大小」部分。它看起來像是將'.form-control'嵌套在'col-'中，而不是將其添加到輸入類 – zgood

不能應用COL-MD-7到輸入標籤。相反，您需要將輸入裏面div。

<div class="form-group"> 
    @Html.LabelFor(m => m.GroupId, new { @class = "col-md-2 control-label" }) 
    <div class="col-md-7"> 
     @Html.TextBoxFor(m => m.GroupId, new { @class = "form-control" }) 
    </div> 
</div>

來源

2017-03-15 19:56:08 Win

感謝你。這就是我在代碼中找到代碼時的代碼方式，但認爲我知道的更好，我認爲將col-md-7添加到文本框類似標籤看起來更乾淨。 – Caverman

Bootstrap表單標籤不放在文本框之前？

回答

相關問題