css - 複数列の要素をトップダウンの前に左右に流します

Question

これは可能ですか？

したがって、リストがある場合：

• アイテム1
• アイテム2
• アイテム3
• アイテム4

それ以外の

アイテム1アイテム3

アイテム2アイテム4

欲しい

アイテム1アイテム2

アイテム3アイテム4

これは複数列のレイアウトモジュールで可能ですか、それとも昔ながらのフロートまたはインラインdivでこれを行う方が良いですか？

Answer 1

このような？

<style>
  ul {list-style: none;}
  li {float: left;}
  li:nth-child(2n+1) {clear: left;} /* 1st of every twos */
</style>
<ul>
  <li>item 1</li>
  <li>item 2</li>
  <li>item 3</li>
  <li>item 4</li>
</ul>