row-gap property in CSS

Example

A simple row-gap property example:

#grid-container {
    border: 3px solid green;
    background-color: mintcream;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    row-gap: 60px;
}

Laboratory

description & Usage

We use the row-gap property to determine the grid design between the rows.

Informations

#	Description
Default Value	normal
Inherited	no
Animatable	yes
Version	CSS Box Alignment Module Level 3
JavaScript syntax	object.style.rowGap="50px"

Browser compatibility and Support

#	Chrome	Edge	Firefox	Safari	Opera
row-gap (in Grid)
row-gap (in Flexbox)

Syntax

row-gap: length|normal|initial|inherit;

Values

Values	Description
length	Specifies the length or percentage for spacing between lines.
normal	A regular gap is created between the rows.
initial	Adds this value to its default property.
inherit	It inherits this value from its parent tag.

row-gap property CSS

Example

description & Usage

Informations

Browser compatibility and Support

Syntax

Values