row-gap (grid-row-gap)#

#Introduction

The row-gap/grid-row-gap CSS property sets the size of the gap (gutter) between an element's rows in flexible box layout and grid layout.

For compatibility, row-gap or grid-row-gap can be used both.

#Examples

css-apisrc/row-gap/App.tsx

Preview

#Values

#<length>

<length> is the width of the gutter separating the rows.

#<percentage>

<percentage> values are relative to the dimension of the element.

#Formal syntax

#Syntax

/* <length> values */
row-gap: 20px;
row-gap: 1em;

/* <percentage> value */
row-gap: 10%;

/* calc() values */
row-gap: calc(10% + 20px);

#Formal definition

#Difference with the web

mdn: row-gap

1. normal is not supported.

#Compatibility

LCD tables only load in the browser

#FAQ