井内浮体形式

Question

我想把两种形式放在一个井旁边。我使用twitter-boostrap。

这是我的代码

 <div class="well"> 
      <h3> 
      Title 
      </h3> 
      <form method="post" class="form-horizontal"> 
       <div class="control-group"> 
       <label class="control-label" for="select01">Label1: </label> 
       <select class="input-mini" id="select01"> 
         (my options) 
       </select> 
      </div> 
       <div class="control-group"> 
       <label class="control-label" for="input01">Label2: </label> 
       <input class="input-mini" id="input01"> 
      </div> 
      <div class="control-group"> 
       <label class="control-label" for="select02">Label3: </label> 
       <select class="input-mini" id="select02"> 
       (myoptions) 
       </select> 
      </div> 
      <div class="form-actions"> 
      <button type="submit" class="btn btn-primary">Submit</button> 
      </div> 
      </form> 
      <form method="post" class="form-horizontal"> 
       <div class="control-group"> 
       <label class="control-label" for="input02">Label3: </label> 
        <input class="input-mini" id="input02"> 
       </div> 
       <div class="control-group"> 
       <label class="control-label" for="input03">Label4: </label> 
        <input class="input-mini" id="input03"> 
       </div> 
      <div class="form-actions"> 
      <button type="submit" class="btn btn-primary">Submit</button> 
      </div> 

      </form> 
</div> 

如果我包括div的形式，添加一个风格的浮动：左，然后我好刹车，把我的形式出来。我在表单内尝试了span，div，form，但是我无法找到一种方式将其中一个窗体放在另一个窗体旁边，而不会破坏它。

Answer 1

尝试你的包裹形式的一个div该内容从井隔离：

http://jsfiddle.net/SAdM8/6

<div class="well"> 
    <div style="overflow: hidden;"> 
    ... forms ... 
    </div> 
</div> 

像比利护城河说，你可以简单地溢出属性添加到井里。我更喜欢将Bootstrap元素保持在自然状态以避免无意中破损。要么工作。