title: How to proper align after CSS column-count
body: <p>I'm working on an unordered list. I'm trying to display the content in multiple columns. I've managed to do this with CSS's column-count, however the content is not displayed properly. It seems like the first item of the list is placed on the second position, resulting in a crooked list.</p>
  
  <p>Instead of this output:</p>
  
  <pre><code>A  F  K
  B  G  L
  C  H  M
  D  I  N
  E  J  O
  </code></pre>
  
  <p>I get:</p>
  
  <pre><code>   E  J  O    
  A  F  K  
  B  G  L 
  C  H  M
  D  I  N
  </code></pre>
  
  <p>or, when I have two items to place in two columns, I want:</p>
  
  <pre><code>A  B 
  </code></pre>
  
  <p>but I get:</p>
  
  <pre><code>   A  B
  </code></pre>
  
  <p>So it seems like the first position is always skipped. I've looked for ways t solve this but couldn't find others with this problem, mostly people have other alignment issues. This is the CSS of the div that contains the ul:</p>
  
  <pre><code>div.partlist { 
  -moz-column-count: 3;
  -moz-column-gap: 10px;
  -webkit-column-count: 3;
  -webkit-column-gap: 10px;
  column-count: 3;
  column-gap: 10px;
  }
  </code></pre>
  
  <p>Anyone any thoughts?</p>