CSSのflexbox(display:flex)で横並びで個数を固定して折り返す方法を紹介しています。 See the Pen CSS flexbox Fix the number by yochans (@yochans) on CodePen. display:flexで横並びの個数を固定して折り返すflexbox(display:flex)で横並びの個数を固定して折り返すサンプルコードです。 上記サンプルのHTMLコードです。 こちらを利用して実装方法を紹介しています。 <div id="container"> <div>1</div> <div>2</div> <div>3</div> <div>4</div> <div>5</div> <div>6</div> <div>7</div> <div>8</div> </div>flexboxは個数を折返しまでの直接指定する事はでき