grid-template-rows
CSS
.container {
display: grid;
height: 600px;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: 100px;
}
Box-1
Box-2
Box-3
Box-4
Box-5
Box-6
Box-7
Box-8
Box-9
CSS
.container {
display: grid;
height: 600px;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: 100px 150px;
}
Box-1
Box-2
Box-3
Box-4
Box-5
Box-6
Box-7
Box-8
Box-9
CSS
.container {
display: grid;
height: 600px;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: 100px 150px 200px;
}
Box-1
Box-2
Box-3
Box-4
Box-5
Box-6
Box-7
Box-8
Box-9
Using repeat() function in css
CSS
.container {
display: grid;
height: 600px;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(3, 100px);
}
Box-1
Box-2
Box-3
Box-4
Box-5
Box-6
Box-7
Box-8
Box-9
CSS
.container {
display: grid;
height: 600px;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(3, 1fr);
}
Box-1
Box-2
Box-3
Box-4
Box-5
Box-6
Box-7
Box-8
Box-9