title: Page styling: alternative to using floats
body: <p>Whenever I want to place elements next to each other I tend to use floats on them. like using two divs with float:left on them. 
  I am wondering if that is the best strategy or there is a better alternative out there.</p>
  
  <p>This is an example code</p>
  
  <pre><code> &lt;div&gt;
    &lt;div style="float:left"&gt;
      &lt;p&gt;Alphabet&lt;/p&gt;
      &lt;select  style="width: 200px;"&gt;
       &lt;option&gt;A&lt;/option&gt;
       &lt;option&gt;B&lt;/option&gt;
      &lt;/select&gt;
      &lt;/div&gt;
        &lt;div style="float:left;  margin-left:20px;"&gt;
           &lt;p&gt;Number&lt;/p&gt;&lt;input type="text" value="123" /&gt;
        &lt;/div&gt;
   &lt;/div&gt;
  </code></pre>
  
  <p>What else can I improve in the above code. Is that <code>&lt;p&gt;</code> really necessary or should I use some other tag.</p>
  
  <p><a href="http://jsfiddle.net/nkvP6/1/">A Live Example</a></p>