title: Four column forms layout with css
body: <p>I have achieved nice a two column layout form with the help of CSS wiht the help of the following guide.</p>
  
  <p><a href="http://articles.sitepoint.com/article/fancy-form-design-css" rel="nofollow">http://articles.sitepoint.com/article/fancy-form-design-css</a></p>
  
  <p>My markup looks roughly like </p>
  
  <pre><code>&lt;form&gt;
    &lt;fieldset&gt; 
      &lt;legend&gt;
        &lt;ol&gt;
          &lt;li&gt;
             &lt;label&gt;
             &lt;/label&gt;
             &lt;field&gt;
             &lt;field&gt;
          &lt;/li&gt;
          &lt;!-- more fileds --&gt;
        &lt;/ol&gt;
    &lt;/fieldset&gt;
  
    &lt;fieldset&gt;
       &lt;!-- similar --&gt;
    &lt;/fieldset&gt;
  
  &lt;/form&gt;
  </code></pre>
  
  <p>This creates a nice two column layout. What I would like to achieve is that instad of placing the fieldsets one after the other vertically, place them side by side. This should give me a four column layout.</p>
  
  <p>How can I achieve this ?</p>