グリッドアイテムの自動で並ぶ方向変更

グリッドアイテムが自動的に並ぶときの並び方向を変更するには、grid-auto-flowプロパティを使用します。

• ※ IE10、IE11は対応していません。

構文

							grid-auto-flow:方向;
						

指定値

設定値	説明
row	水平（Z字型）方向
column	垂直（逆N字型）方向
row dense	水平（Z字型）方向かつ空間を埋める
column dense	垂直（逆N字型）方向かつ空間を埋める

サンプルコード

row：

• 1
• 2
• 3
• 4
• 5
• 6

row dense：

• 1
• 2
• 3
• 4
• 5
• 6

column：

• 1
• 2
• 3
• 4
• 5
• 6

column dense：

• 1
• 2
• 3
• 4
• 5
• 6