title: How to force inline-block wrap to new line using CSS or jQuery?
body: <p>I have ten items. How do I make it to two lines, each having five items?</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;ul&gt;
      &lt;li&gt;item1&lt;/li&gt;
      &lt;li&gt;item2&lt;/li&gt;
      //...
      &lt;li&gt;item5&lt;/li&gt;
      //newline
      &lt;li&gt;item6&lt;/li&gt;
      &lt;li&gt;item10&lt;/li&gt;
  &lt;ul&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>ul li { display: inline-block; }
  </code></pre>
  
  <p>Note, I have to use <code>inline-block</code> instead of <code>inline</code>.</p>