title: Format and position of checkboxes with CSS
body: <p>I've got a set of checkboxes I would like to position using CSS. This is how they are rendered:</p>
  
  <pre><code>&lt;div id="edit-event-type" class="form-checkboxes"&gt;
    &lt;div class="form-item form-type-checkbox form-item-event-type-pubQuiz"&gt;
      &lt;input type="checkbox" id="edit-event-type-pubquiz" name="event_type[pubQuiz]" value="pubQuiz" class="form-checkbox"&gt;  
      &lt;label class="option" for="edit-event-type-pubquiz"&gt;Pub Quiz &lt;/label&gt;
  &lt;/div&gt;
  
  &lt;div class="form-item form-type-checkbox form-item-event-type-dancing"&gt;
    &lt;input type="checkbox" id="edit-event-type-dancing" name="event_type[dancing]" value="dancing" class="form-checkbox"&gt;      
    &lt;label class="option" for="edit-event-type-dancing"&gt;Dancing &lt;/label&gt;
  &lt;/div&gt;
  
  &lt;div class="form-item form-type-checkbox form-item-event-type-foodDeals"&gt;
    &lt;input type="checkbox" id="edit-event-type-fooddeals" name="event_type[foodDeals]" value="foodDeals" class="form-checkbox"&gt;
    &lt;label class="option" for="edit-event-type-fooddeals"&gt;Food Deals &lt;/label&gt;
  &lt;/div&gt;
  
   &lt;div class="form-item form-type-checkbox form-item-event-type-liveMusic"&gt;
     &lt;input type="checkbox" id="edit-event-type-livemusic" name="event_type[liveMusic]" value="liveMusic" class="form-checkbox"&gt;  
     &lt;label class="option" for="edit-event-type-livemusic"&gt;Live Music &lt;/label&gt;
   &lt;/div&gt;
  &lt;/div&gt;
  
  //Other form elements come after.
  </code></pre>
  
  <p>At the moment, they are getting displayed stacked one on top of another and I would like them to be displayed in stackes of, say 4. So I would like them to be displayed like this:</p>
  
  <p><a href="http://i.imgur.com/SvIQv.png" rel="nofollow">http://i.imgur.com/SvIQv.png</a></p>
  
  <p>However, I have limited control over the markup so ideally I would like it all to be done in CSS. I have tried <code>float:left</code> and assigning them a right margin, but when I do that, although they are in stacks of 4, there is an issue where they are not aligned properly. Has anyone had an issue like this before?</p>
  
  <p>Thanks,</p>