title: CSS - Possible to reflow checkboxes in columns?
body: <p>Is it possible to reflow a dynamic/unknown number of checkboxes into columns horizontally as the height of the container changes?  Here is a simple diagram of what I mean:</p>
  
  <p><strong>Height = 180px (20px * 9 checkboxes):</strong></p>
  
  <pre><code>[ ] Checkbox 1
  [ ] Checkbox 2
  [ ] Checkbox 3
  [ ] Checkbox 4
  [ ] Checkbox 5
  [ ] Checkbox 6
  [ ] Checkbox 7
  [ ] Checkbox 8
  [ ] Checkbox 9
  </code></pre>
  
  <p><strong>Height = 140px (20px * 7 checkboxes):</strong></p>
  
  <pre><code>[ ] Checkbox 1    [ ] Checkbox 8
  [ ] Checkbox 2    [ ] Checkbox 9
  [ ] Checkbox 3
  [ ] Checkbox 4
  [ ] Checkbox 5
  [ ] Checkbox 6
  [ ] Checkbox 7
  </code></pre>
  
  <p><strong>Height = 100px (20px * 5 checkboxes):</strong></p>
  
  <pre><code>[ ] Checkbox 1    [ ] Checkbox 6
  [ ] Checkbox 2    [ ] Checkbox 7
  [ ] Checkbox 3    [ ] Checkbox 8
  [ ] Checkbox 4    [ ] Checkbox 9
  [ ] Checkbox 5
  </code></pre>
  
  <p>As the container element's height shrinks, the checkbox elements would spill horizontally into a new column.</p>
  
  <p><strong>NOTE:</strong>  I'm well aware that I can create my own columns programmatically, and I'm just looking to see if this is possible with <em>pure HTML/CSS.</em></p>