grid-auto-rows プロパティ
grid-auto-rows プロパティは、グリッドコンテナの子エレメント（グリッドアイテム）の高さを指定するプロパティです。
grid-auto-rows プロパティの値はグリッドコンテナに設定します。その設定は、全ての子エレメントに反映されます。
グリッドコンテナとは、display:grid; が設定されたエレメントです。
display: grid;
grid-auto-rows: 300px;
grid-auto-flow: column;
ページ内 Index
構文(Syntax)
CSS
grid-auto-rows: auto | max-content | min-content | minmax(a,b) | fit-content(length) | length ;
DOM ( JavaScript )
String = object.style.gridAutoRows;
object.style.gridAutoRows=" auto | max-content | min-content | minmax(a,b) | fit-content(length) | length ";
値（Values）
| Value | 摘要 |
|---|---|
| auto | 初期値（default値） |
| max-content | 最大サイズ |
| min-content | 最小サイズ |
| minmax(a,b) | a以上b以下で自動調整 |
| fit-content(length) | 最大lengthのサイズ |
| length | CSS長さの単位 |
備考（Remarks）
| 初期値（Default value） | auto |
| 継承（Inherited） | No |
| CSS Animation | Yes |
Example
grid-auto-rows プロパティの例です。
親エレメント<div id="over">に、grid-template-columnsプロパティでグリッドアイテムを左から幅100px、200px、autoで指定しています。
コンテンツ4、5は指定していません。
さらに、grid-auto-rows で高さ 100px に指定しています。全てのグリッドアイテムが同じ高さ 100px で反映されています。
関連する CSS プロパティ
以下は、grid-auto-rows プロパティに関連するプロパティです。
| display:grid; | 並びを設定することができるdisplayプロパティ |
| grid-area | グリッドアイテムに名称を指定 |
| grid-auto-columns | グリッドアイテムの幅 |
| grid-auto-flow | グリッドコンテナの領域を自動的に拡張 |
| grid-auto-rows | 全てのグリッドアイテムの高さ |
| grid-column | グリッドアイテムの列単位の位置と連結数 |
| grid-column-end | 列単位の位置や連結数 |
| grid-column-gap | 列同士のギャップ幅 |
| grid-column-start | 列単位（横）の位置や連結数 |
| grid-gap | グリッドアイテムどうしのギャップのサイズ |
| grid-row | 行単位の位置と連結数 |
| grid-row-end | 行単位の位置や連結数 |
| grid-row-gap | 行同士のギャップ幅 |
| grid-row-start | 行単位の位置や連結 |
| grid-template | グリッドアイテムの並び数やサイズ |
| grid-template-areas | グリッドアイテムの配置や連結 |
| grid-template-columns | グリッドアイテムの列の並び数、幅 |
| grid-template-rows | グリッドアイテムの行の並び数と高さ |