title: Replace HTML Table with Divs
body: <p>Alright, I'm trying to buy into the idea that html tables should not be used, and that divs should be. However, I often have code that resembles the following</p>
  
  <pre><code>&lt;table&gt;
      &lt;tr&gt;
          &lt;td&gt;First Name:&lt;/td&gt;
          &lt;td colspan="2"&gt;&lt;input  id="txtFirstName"/&gt;&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
          &lt;td&gt;Last Name:&lt;/td&gt;
          &lt;td colspan="2"&gt;&lt;input  type="text" id="txtLastName"/&gt;&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
          &lt;td&gt;Address:&lt;/td&gt;
          &lt;td&gt;
              &lt;select type="text" id="ddlState"&gt;
                  &lt;option value="NY"&gt;NY&lt;/option&gt;
                  &lt;option value="CA"&gt;CA&lt;/option&gt;
              &lt;/select&gt;
          &lt;/td&gt;
          &lt;td&gt;
              &lt;select type="text" id="ddlCountry"&gt;
                  &lt;option value="NY"&gt;USA&lt;/option&gt;
                  &lt;option value="CA"&gt;CAN&lt;/option&gt;
              &lt;/select&gt;
          &lt;/td&gt;
      &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>I want the labels to be aligned and I want the controls to be aligned.  How would I do this without using tables?</p>