разницы в формах между бутстрапом 4 альфа 4 и альфа-6

Question

У меня есть следующий код:

<div class="card"> 
<div class="card-block"> 
    <form> 
     <div class="form-group col-sm-6"> 
      <label for="visualTheme" class="control-label">Visual Theme</label> 
      <div> 
       <input class="form-control" 
         style="height:30px;width:250px" id="visualTheme" /> 
      </div> 
     </div> 
     <div class="form-group col-sm-6"> 
      <label for="startingScreen" class="control-label">Starting Screen</label> 
      <div> 
       <input class="form-control" 
         style="height:30px;width:250px" id="startingScreen" /> 
      </div> 
     </div> 
    </form> 
</div> 

, что использование B4 Альфа 4 производили что-то вроде этого:

Но используя Alpha 6 выглядит следующим образом:

Вот мои Fiddle

Почему это упаковка колонны, даже если есть достаточно места, чтобы иметь их на той же строке? И это делает это правильно с альфа 4.

Благодарности

Answer 1

col-* всегда должны быть помещены в row ..

<div class="card"> 
     <div class="card-block"> 
      <form class="row"> 
       <div class="form-group col-sm-6"> 
        <label for="visualTheme" class="control-label">Visual Theme</label> 
        <div> 
         <input class="form-control" style="height:30px;width:250px" id="visualTheme"> 
        </div> 
       </div> 
       <div class="form-group col-sm-6"> 
        <label for="startingScreen" class="control-label">Starting Screen</label> 
        <div> 
         <input class="form-control" style="height:30px;width:250px" id="startingScreen"> 
        </div> 
       </div> 
      </form> 
     </div> 
    </div> 

http://www.codeply.com/go/MtjfuZpqti