Alinear casillas de verificación (web)

Question

Una imagen dice más de mil palabras?

Me gustaría que los segundo (y consecutivas) líneas para estar alineado con el primero. ¿Algunas ideas?

HTML está

<input><span>text</span> 

Answer 1

.thing input { float: left; } 
.thing label { display: block; margin-left: 2em; } 

<div class="thing"> 
    <input type="radio" id="potato"/> 
    <label for="potato">Text over multiple lines should be aligned properly...</label> 
</div> 

Answer 2

me encontré con las mismas cosas y lo resolvió de esta manera. El gran problema era la lista de elementos de la lista cuyo texto ocupaba varias líneas.

HTML

<div class="checkboxlist"> 
    <ul> 
     <li> 
      <asp:CheckBox ID="CheckBox1" runat="server" Text="This is a checkbox option in an unordered list that is pretty long and ends u wrapping onto another line, but maintains alignment" /> 
     </li> 
     <li> 
      <asp:CheckBox ID="CheckBox2" runat="server" Text="This is yet another checkbox option in an unordered list that is pretty long and ends u wrapping onto another line, but maintains alignment" /> 
      <div> 
       <br /> Here's some other info as well that isn't a part of the checkbox. The alignment for this works as well. 
      </div> 
     </li> 
    </ul> 
</div> 

CSS

div.checkboxlist ul li { margin: 7px 0px; } 
div.checkboxlist ul li input { width: 15px; display: block; float:left;} 
div.checkboxlist ul li label { padding-left: 28px; display: block; } 
div.checkboxlist ul li div { margin-left: 28px; clear: both; font-size: .9em; } 

Para una discusión más detallada ver mi post aquí: Aligning a List of Checkboxes with Text that Wraps