如何在div中对齐文本字段

Question

我试图在div中对齐文本字段并使它们向左浮动,使它们看起来像一个表.

我想要一个如下布局:

Label1: TextField    Label2: TextField     Label3: TextField
Label4: TextField    Label5: TextField     Label6: TextField

我试图这样做,但它不会出来正确. http://jsbin.com/izuwi3/edit

Answer 1

我很快就把它放在一起，所以它肯定可以改进，但是像这样的东西怎么样？

http://jsfiddle.net/LBcp5/1/

我所做的本质上是为表中的一行创建一个容器。我这样做的方式如下：

<div class="row">
   // put whatever you want in here
</div>

...我正在设计这个row类，clear: both以便每一行都在自己的行上。您可以在每行中添加<div>任意数量的元素，并将它们浮动到左侧或使用display: inline以获得您想要的效果。

因此，当您需要多行时，您可以创建多个这样的row容器。查看上面的 jsFiddle 演示作为示例。

我希望这有帮助。