9

やや長いリストがあり、垂直の列に「ラップ」したいと考えています。10 項目のリストがあり、1 列あたり 5 項目にしたい場合、レイアウトは次のようになります。

1   6
2   7
3   8
4   9
5   10

CSSでこれを行う方法はありますか?

4

2 に答える 2

17

申し訳ありませんが、実際には非常に簡単です。

ul {
-webkit-column-count: 2;
   -moz-column-count: 2;
        column-count: 2;
}

このデモをチェックしてください

于 2013-02-04T04:27:32.950 に答える
8

CSS3 列を使用します。特に、 を設定した場合はcolumn-width、必要な数の列を作成する必要があります。各列に同じ数の項目を与えるよりも下に行くことを優先したい場合は、に設定できcolumn-fillますauto

于 2013-02-04T04:23:07.927 に答える