css - 如何水平制作两个字段集？

Question

我有一个包含两个字段集元素的表单

<form>
   <fieldset>
   </fieldset>

   <fieldset>
   </fieldset>
</form>

我需要使水平？

Answer 1

只需浮动它们并添加宽度。

fieldset {
  float: left;
  width: 50%;
}

Answer 2

您可以将它们排成一排流体跨度6。你可以做一些其他的事情，但是井会导致排问题。

<form class="row-fluid well">
    <fieldset class='span6'>
      <legend>Legend 1</legend>
      <label class="radio">
        <input type="radio" name="option1"/> Option1
      </label>    
        <label class="radio">
         <input type="radio" name="option2"/> Option2
      </label> 
    </fieldset>    

    <fieldset class='span6'>
       <legend>Legend 2</legend>
       <select>
           <option> option1 </option>
        </select>    
    </fieldset>
</form>    

Answer 3

您可以通过添加到母亲来做到这一点：

overflow: hidden;

并添加到字段集中：

display: block; float: left;

见例子：http: //jsfiddle.net/JXf8g/25/