使用CSS定位标签和输入

我已经做到了这一点（一个表单布局）

。。。下一个CSS

label {
    clear:left;
    float:left;
    margin-right:10px;
    text-align:right;
    width:100px;
}
input {
    float:left;
}

但我试图做另一件事却没有成功

它就像一个子表单，具有相同的布局来代替输入

有一个解决方案吗？

这个怎么样

div {
    /* either */ margin-left: 110px;
    /* or */     float: left;
}

---

这在我的机器上运行，在IE8和Firefox（我唯一关心的浏览器）上测试

以及HTML代码：

    <label>x</label><input type="text" />
    <label>x</label><input type="text" />
    <label>x</label><input type="text" />
    <label>x</label><input type="text" />
    <label>x</label>
    <div>
        <label>y</label><input type="text" />
        <label>y</label><input type="text" />
        <label>y</label><input type="text" />

    </div>

x
x
x
x
x
Y
Y
Y

浮动元素使其呈现为块框，并强制非浮动元素在其周围流动。div是块级元素，默认情况下，它的“清除”设置为“无”，因此它与第一个浮动元素在同一行上渲染，并增长以消耗整行，但div内的标签元素设置为“清除左侧”，因此它们清除所有标签/输入元素，并在其下方渲染

通过将div元素设置为与输入一样浮动，它将被渲染为与其他浮动内联的块框

更改：

input {
    float:left;
}

致：

---

UH我去掉左边的空白：110px；而且运行平稳！我不知道FLOAT元素内部的CLEAR属性不受外部其他块的影响。谢谢哦，对了，对不起。如果该div没有浮动，保证金将是有用的。：）

input {
    float:left;
}

input, div {
    float:left;
}