CSSでのリストの並び方・方向について

Question

リストを普通に並ばせると
12
34
56
になりますが
14
25
36
にするやりかたはありますでしょうか。
ちなみに７つに増えた場合は
15
26
37
4
になるような感じです。
何卒よろしくお願いいたします。

<ul class="list_number">
              <li>1</li>
              <li>2</li>
              <li>3</li>
              <li>4</li>
              <li>5</li>
              <li>6</li>
            </ul>

.list_number {
  display: flex;
  flex-wrap: wrap;
}
.list_number > li {
  width: 50%
}

Comments

[kei344]

質問内容が書かれていません。

[hiroakitajima]

htmlインデント直そうとしてキー連打してたら投稿してしまいました。内容修正したので引き続き宜しくおねがいします。

[m.ts10806]

HTMLは変えない前提でしょうか。
もしページングでしたら動的ですし出力時に並べたほうが楽に思います。

Answer 1

columns とか。

【columns | MDN】
https://developer.mozilla.org/ja/docs/Web/CSS/columns

【段組みレイアウトの使用 | MDN】
https://developer.mozilla.org/ja/docs/Web/Guide/CSS/Using_multi-column_layouts

【マルチカラムレイアウトとは？columnプロパティについて - Qiita】
https://qiita.com/nezurika/items/dbc4e5987f77df94df29

Comments

[hiroakitajima]

ご回答有り難うございます。
ご教示頂いた通り、 ulにcolumns: 2 auto;と指定したところ思い通りの形になりました。
とても助かりました！どうもありがとうございました。