Change list vertically to horozontally with 4 lines interval

Question

I have a list with ul li like this

• Item line 1
• Item line 2
• Item line 3
• Item line 4
• Item line 5
• Item line 6
• Item line 7
• Item line 8
• Item line 9
• Item line 10
• Item line 11
• Item line 12

And I need to change to this, its possible only with CSS ?

Item line 1         Item line 5         Item line 9
Item line 2         Item line 6         Item line 10
Item line 3         Item line 7         Item line 11
Item line 4         Item line 8         Item line 12

Regards

Daniel

Answer 1

Use columns on the <ul>.

ul {
  columns: 3;
  }

<ul>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
  <li>Item 4</li>
  <li>Item 5</li>
  <li>Item 6</li>
  <li>Item 7</li>
  <li>Item 8</li>
  <li>Item 9</li>
  <li>Item 10</li>
  <li>Item 11</li>
  <li>Item 12</li>
</ul>