grid-auto-rows property in CSS

A simple grid-auto-rows property example:

.grid-container {
    display: grid;
    grid-auto-rows: 200px;
    grid-gap: 15px;
    background-color: #2196F3;
    padding: 15px;
}

Laboratory

description & Usage

To determine the size of the rows in the grid layout, we use the grid-auto-rows property.

#	Description
Default Value	auto
Inherited	no
Animatable	yes
Version	CSS Grid Layout Module Level 1
JavaScript syntax	object.style.gridAutoRows="60px"

#	Chrome	Edge	Firefox	Safari	Opera
grid-auto-rows

grid-auto-rows: auto|max-content|min-content|length;

Values	Description
auto	Default
max-content	Determines the size of each row so that it is the same size as the largest item in the row.
min-content	Determines the size of each row so that it is the same size as the smallest item in the row.
length	Determines the size of the lines efficiently from the legal length.