フォームの意味の変更セマンティックui

Question

こんにちは私はセマンティックUIを使ってプロジェクトを進めています。次のように私は、フォームを持っている：

http://jsfiddle.net/5dyzpt77/

<div class="content"> 
    <div class="ui main container"> 
    <div class="ui form"> 
    <div class="one field"> 
     <div class="field"> 
     <label>Email</label> 
     <div class="one field"> 
      <div class="field"> 
      <input type="text"> 
      </div> 
     </div> 
     </div> 
     <div class="field"> 
     <label>Address</label> 
     <div class="three fields"> 
      <div class="field"> 
      <input type="text"> 
      </div> 
      <div class="field"> 
      <input type="text"> 
      </div> 
      <div class="field"> 
      <input type="text"> 
      </div> 
     </div> 
    </div> 
    </div> 
</div> 

それがあるように私は、フォームが全幅にしたくないしかし、私はそれは広い6列になりたいが、それでも中心にしたいです私はそれをどうやってやっていくのか分かりません。どんな助けも素晴らしいだろう。

Answer 1

フォーム-のdivクラスsix wide column centeredに追加して、クラスui gridとdiv要素とそれを包む：

<div class="content"> 
    <div class="ui main container"> 
    <div class="ui grid"> 
    <div class="ui form six wide column centered"> 
    <div class="one field"> 
     <div class="field"> 
     <label>Email</label> 
     <div class="one field"> 
      <div class="field"> 
      <input type="text"> 
      </div> 
     </div> 
     </div> 
     <div class="field"> 
     <label>Address</label> 
     <div class="three fields"> 
      <div class="field"> 
      <input type="text"> 
      </div> 
      <div class="field"> 
      <input type="text"> 
      </div> 
      <div class="field"> 
      <input type="text"> 
      </div> 
     </div> 
    </div> 
    </div> 
</div> 
</div> 

グリッドシステムhere

についてもっと読む jsfiddle

を参照してください。