父母和子div与表格

Question

我有这样的代码：http://jsfiddle.net/bUPWS/1/但＃div2溢出＃div1。如何将溢出的输入与其他输入相邻？

<div id="div1"> 
    <div id="div2"> 
     <form> 
      <input/><br/><input/><br/><input/><br/><input/><br/><input/><br/><input/><br/><input/><br/><input/><br/><input/><br/><input/><br/> 
     </form> 
    </div> 
</div> 

#div1 { 
    width:400px; 
    height:100px; 
    border:1px solid red; 
} 

Answer 1

看到你的代码，我可以说你正在使用<br />标签，所以没有可能的方式，使彼此相邻的投入。只需删除每个<br/>所有的输入将正确对齐。

此外，您可以使用min-height为你的父母DIV div1

#div1 { 
    width:400px; 
    min-height:100px; 
    border:1px solid red; 
} 

#div2 input {display:inline; } 

如果你投入的增加比100px height父div的限制更将相对于调整高度，以输入您的div2块内

编辑：但是要解释我的评论下面我已经更新你的小提琴示例，你可以检查我们如何使用<ul> <li></li></ul>标签

Fiddle example

代码如果在这里！

HTML

<div id="div1"> 
    <div id="div2"> 
     <form> 
      <ul> 
       <li><input/></li> 
       <li><input/></li> 
       <li><input/></li> 
       <li><input/></li> 
       <li><input/></li> 
      </ul> 
      <ul> 
       <li><input/></li> 
       <li><input/></li> 
       <li><input/></li> 
       <li><input/></li> 
       <li><input/></li> 
      </ul> 

     </form> 
    </div> 
</div> 

CSS

#div1 { 
    width:800px; 
    min-height:100px; 
    border:1px solid red; 
} 
*{padding:0; margin:0} 
#div2 ul{float:left; padding-left:10px; } 

Answer 2

我不知道，如果这是你在寻找什么，但你可以设置溢出：汽车的DIV 1和浴液：离开了，作为投入。小提琴：http://jsfiddle.net/bUPWS/28/

Answer 3

尝试使用div的fieldset instad。 请参阅：http://www.w3schools.com/tags/tag_fieldset.asp