title: How to make a multicolumn unordered list?
body: <p>I'm trying to create a list of items that would look like this:</p>
  
  <p><img src="https://i.imgur.com/KSwvZ.gif?1" alt="floated list"></p>
  
  <p>Main requirement is that the list should be flexible in a way that it's possible to add or remove list items without touching the code.</p>
  
  <p>The best solution I found so far is to put all list items (including headers) into the <code>&lt;li&gt;</code> tags and style them with one of the techniques presented in this <a href="http://www.alistapart.com/articles/multicolumnlists/" rel="nofollow noreferrer">A List Apart article</a>:</p>
  
  <pre><code>&lt;ul&gt;
    &lt;li class="header"&gt;Drinks&lt;/li&gt;
    &lt;li&gt;Drink 1&lt;/li&gt;
    &lt;li&gt;Drink 2&lt;/li&gt;
    &lt;li&gt;Drink 3&lt;/li&gt;
    &lt;li class="header"&gt;Meat&lt;/li&gt;
    &lt;li&gt;Meat 1&lt;/li&gt;
    &lt;li&gt;Meat 2&lt;/li&gt;
    &lt;li&gt;Meat 3&lt;/li&gt;
    &lt;li&gt;Meat 4&lt;/li&gt;
    &lt;li&gt;Meat 5&lt;/li&gt;
    &lt;li&gt;Meat 6&lt;/li&gt;
    etc.
  &lt;/ul&gt;
  </code></pre>
  
  <p>I was wondering if there are some better suggestions here on Stack Overflow.</p>