新着！私の44ページの電子書籍「CSS in 44 minutes」が発売されました！😃
#grid-auto-rows
暗黙的に作成されたグリッド行のサイズを定義します。つまり、grid-auto-rowsは、grid-template-rowsまたはgrid-template-areasで定義されなかった行を対象とします。
デフォルト grid-auto-rows: auto;
暗黙的に作成された行は、autoサイズになります。
grid-auto-rows: 100px;
ここでは、grid-template-areas: "header header header" "sidebar main main" "footer footer footer"とgrid-template-rows: 50px 200pxを組み合わせます。
この状況では、grid-template-areasは3行を定義しますが、grid-template-rowsは2行の高さのみを定義します。
その結果、3行目（フッター）の高さはgrid-auto-rowsプロパティの値、つまり100pxになります。