grid-row-gap
A property that specifies the spacing between row elements within a grid framework.
Syntax
.div-container {grid-gap: <gap-value>;}
where <gap-value>
can be one of the following:
- Grid keyword:
normal
- Pixel value:
3px
- A percentage:
1%
Example 1
Rows separated by 4 pixels:
.content-a-container {display: grid;grid-auto-rows: 10%;row-gap: 4px;}
Example 2
A one percent spacing across grid row elements:
.content-b-container {display: grid;grid-template-rows: 10% 78% 10%;row-gap: 1%;}