title: Make the first <li> in a separate row, and rest <li> in two rows & columns
body: <p>I have list that have two columns:</p>
  <pre><code>ul {
      columns: 2;
      -webkit-columns: 2;
      -moz-columns: 2;
    }
  </code></pre>
  <p>This will make all the <li> to be in two rows. I want the first <li> to be in a separate row at the top, and the rest in two columns below it like:</p>
  <pre><code>A
  B C
  D E
  </code></pre>
  <p>I have tried selectors such as;</p>
  <pre><code> ul:first-child {
        display:inline-block;
    }
  </code></pre>
  <p>But it does not work. How to do it?</p>