row-gap
Sets the size of the gap (gutter) between rows in a Grid, Flexbox, or Multi-column layout.
It is documented as part of the CSS Box Alignment specification.
Syntax
/* Usage Example */
.grid-container {
display: grid;
grid-template-columns: 1fr 1fr;
/* only adds space BETWEEN the rows, not columns */
row-gap: 20px;
}
/* Syntax */
row-gap: normal;
/* Global values */
row-gap: inherit;
row-gap: initial;
row-gap: revert;
row-gap: revert-layer;
row-gap: unset;
row-gap Browser support
Widely available
Since
2017 96% global usage
This feature is well established and works across many devices and browser versions. It has been available across browsers since 2017.
47+
52+
10.1+
16+