グリッドレイアウトの基本 Grid Layout
グリッドレイアウトとは
CSSのグリッドは線（ライン）、セル、トラック、領域（エリア）の4つの仕様で構成されています。
グリッドライン（Grid Lines）
グリッドを構成する水平または垂直の線です。
グリッドセル（Grid Cell）
4方向のグリッドラインで囲まれた間のスペースです。
※ c = column、r = row
グリッドトラック（Grid Track）
水平または垂直のいずれかのセルの範囲を示します。
グリッドエリア（Grid Area）
グリッドラインによって結合されたセルです。
対応ブラウザ
IEおよびEdgeでベンダープレフィックスを付けた一部のプロパティのみ対応しています。
| バージョン | |
|---|---|
| Firefox | 46 |
| Chrome | 50 |
| IE | 10～（-ms-） |
| Edge | 13～（-ms-） |
要素をグリッドレイアウトにするには
要素をグリッドレイアウトにするには、displayプロパティの値をgrid（インラインとするならinline-grid）にすることで、グリッドの要素として適用されます。
【HTML】
【CSS】
CSS