Launch Video Player
Terminology
Before we dive into CSS Grid concepts, let’s cover some basic terminology.
Grid lines
The vertical and horizontal lines that divide the grid and separate the columns and rows.
Grid cell
A single unit of a CSS grid.
Grid area
Rectangular space surrounded by four grid lines. A grid area can contain any number of grid cells.
Grid track
The space between two grid lines. This space can be horizontal or vertical
Grid row
A horizontal track of a grid.
Grid column
A vertical track of a grid.
Gutter
The space between rows and columns in a grid.
The container that holds the entire CSS grid. It will be the element that has thedisplay: grid
or display: inline-grid
property on it.
Any element that is a direct child of a grid container.
Got it? Let's move on to creating our first grid with CSS Grid Layout.