質問: CSSによる要素の横並びについて実現可能か否か教えてください。 仮でulのliを使用して説明しています。 ``` リスト01 リスト02 リスト03 リスト04 リスト05 リスト06 ``` 2カラムのリストを実現する場合、floatなりflexboxなどを使用して、 基本的には以下のような並び方になると思います。 ・リスト01 ・リスト02 ・リスト03 ・リスト04 ・リスト05 ・リスト06 **これを以下のような並びにする方法がCSSで可能でしょうか?** ・リスト01 ・リスト04 ・リスト02 ・リスト05 ・リスト03 ・リスト06 **左の列から順番に03まで縦並びにして、上限いっぱいで04以降は右隣に移動し縦並びにしていく。** 以下のようにul分けるという方法ではなく一つのulで完結させたいです。 ``` リスト01 リスト02 リスト03 リスト04 リスト05 リスト06 ``` よろしくお願いいたします。
回答: `ul`要素に ``` display: flex; flex-direction: column; ``` を適用してみてください。 `ul`要素と`li`要素の高さを調節することで折り返し位置も調整できます。 flexboxコンテナ: flex-direction