CSS grid-row-gap property

Definition and Usage

The grid-row-gap property defines the size of the row gap in the grid layout.

See Also:

CSS Tutorial:CSS Grid Layout

CSS Reference Manual:grip-gap property

CSS Reference Manual:grip-column-gap property

Example

Set the row gap to 50 pixels:

.grid-container {
  grid-row-gap: 50px;
}

Try It Yourself

CSS Syntax

grid-row-gap: length;

Attribute Value

Value Description
length Any valid length value. For example, pixels or percentages. The default value is 0.

Technical Details

Default Value: 0
Inheritance: No
Animation Production: Supported. See:Animation-related Properties.
Version: CSS Grid Layout Module Level 1
JavaScript Syntax: object.style.gridRowGap="50px"

Browser Support

The numbers in the table indicate the first browser version that fully supports this attribute.

Chrome IE / Edge Firefox Safari Opera
57 16 52 10 44