I have markup like <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" /> How can I make column two rows to be aligned on the left, currently they are positioned depending on the length of the the text in the label? I don't want a full CSS grid just for this one place where I need alignment.