かみそりの列を定義

Question

私のひげ剃りコードは、このレイアウトを作成します。

が、私はこの位置が好きではありません。私はこれのようなものになるだろう。

は、どのように私は上記の画像のようなものを作成することができますか？

これは私の剃刀コードです。

 <div class="form-group"> 

        @Html.LabelFor(model => model.Name, new { @class = "control-label col-md-2" }) 
        <div class="col-md-4"> 
         @using (DAEF.DA_Mit daef = new DAEF.DA_Mit()) 
         { 
          @Html.DropDownListFor(
          model => model.CodMit, 
          new SelectList(daef.SelectAll(), "CodMit", "ItemPerDropdown"), new { @class = "form-control" }) 
         } 
         @Html.ValidationMessageFor(model => model.CodMit, "", new { @class = "text-danger" }) 
        </div> 


        @Html.LabelFor(model => model.CodCreator, new { @class = "control-label col-md-2" }) 
        <div class="col-md-4"> 
         @using (DAEF.DA_Mit daef = new DAEF.DA_Mit()) 
         { 
          @Html.DropDownListFor(
          model => model.CodCreator, 
          new SelectList(daef.SelectAll(), "CodMit", "ItemPerDropdown"), new { @class = "form-control" }) 
         } 
         @Html.ValidationMessageFor(model => model.CodMit, "", new { @class = "text-danger" }) 
        </div> 

       </div> 

       <div class="form-group"> 
        @Html.LabelFor(model => model.Info, new { @class = "control-label col-sm-2" }) 
        <div class="col-sm-4"> 
         @Html.TextAreaFor(model => model.Info, new { @class = "form-control", rows = 4 }) 
         @Html.ValidationMessageFor(model => model.Info, "", new { @class = "text-danger" }) 
        </div> 
       </div> 

      </div> 

私を助けてくれる人はいますか？最後

<div class="col-sm-4"> 

Answer 1

は

<div class="col-sm-12"> 

と

<div class="col-md-4"> 

他の2

ことをする必要があり

<div class="col-md-6"> 

も作る2つの区切りのグループの代わりに、ネストされた2つのグループに使用

グリッド・システムの詳細を

： https://v4-alpha.getbootstrap.com/layout/grid/