css - 用 CSS 对齐两列

Question

我有类似的标记

<div> <label for="a" class="float-left">column 1 row 1</label> <input type="text" value="column 2 row 1" id="a"  class="float-left"/>

<div class="float-clear"></div>

<div> <label for="b" class="float-left">longer column 1 row 2</label> <input class="float-left" type="text" value="column 2 row 2" id="b" />   

<div class="float-clear"></div>

<div> <label class="float-left" for="c">column 1 row 2</label> <input class="float-left" type="checkbox" id="c" />

如何使两行在左侧对齐，目前它们的位置取决于标签中文本的长度？我不想要一个完整的 CSS 网格，只是为了这个我需要对齐的地方。

Answer 1

如果你只想要一个地方，你可以用 margin-left 来做。

另一个答案是让你的标签内联块元素并给它们一个设定的宽度。