title: Bootstrap grid - columns first?
body: <p>I'm fairly new to Bootstrap and have come across a problematic task that I first thought would be pretty simple. And maybe it is for someone with sufficient experience of Bootstrap.</p>
  
  <p>If I have a row of 12 columns that should be stacked on top of each other in a single-column layout, divided into 2 x 6 in a two-column layout and 3 x 4 in a three-column layout, the result would typically be:</p>
  
  <pre><code>1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  </code></pre>
  
  <p>and </p>
  
  <pre><code>1    2
  3    4
  5    6
  7    8
  9    10
  11   12
  </code></pre>
  
  <p>and</p>
  
  <pre><code>1    2    3
  4    5    6
  7    8    9
  10   11   12
  </code></pre>
  
  <p>What I want, however, is this:</p>
  
  <pre><code>1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  </code></pre>
  
  <p>and </p>
  
  <pre><code>1    7
  2    8
  3    9
  4    10
  5    11
  6    12
  </code></pre>
  
  <p>and</p>
  
  <pre><code>1    5    9
  2    6    10
  3    7    11
  4    8    12
  </code></pre>
  
  <p>Is there any easy way to accomplish this with standard Bootstrap classes? </p>
  
  <p>There is an example of such a layout here: <a href="http://bildarkivet.orsa.se" rel="nofollow">http://bildarkivet.orsa.se</a> At this site the 12 input elements are ordered into columns with the CSS column-count property, but it would be nice to be able to incorporate a similar ordering style into a Bootstrap-based site.</p>