使用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。

另一个答案是制作标签内联块元素并为它们设置所有宽度。