CSS row-gap eigenschap

Definitie en gebruik

De eigenschap row-gap bepaalt de spatiëring tussen de rijen in het elastische of rasterindeling.

De eigenschap row-gap werd vroeger genoemd grid-row-gap.

CSS referentiemanual:gap eigenschap

Stel de 50 pixel spatiëring tussen de rasterrijen in:

#grid-container {
  display: grid;
  row-gap: 50px;
}

Stel de rijspatiëring in op 70px in het elastische frame-indeling:

#flex-container {
  display: flex;
  row-gap: 70px;
}

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

waarde	beschrijving
length	Stel de specifieke lengte of procentuele waarde in voor de spatiëring tussen de rijen.
normal	standaardwaarde. Stelt de normale spatiëring tussen de rijen vast.
initial	Stel deze eigenschap in op de standaardwaarde. Raadpleeg: initial.
inherit	Deze eigenschap erfgenamen van de ouderlijke element. Raadpleeg: inherit.

standaardwaarde:	normal
inheritance:	nee
animatie maken:	ondersteund. Raadpleeg de afzonderlijke eigenschappen. Zie ook:animatiegerelateerde eigenschappen.
versie:	CSS Box Alignment Module Level 3
JavaScript syntaxis:	object.style.rowGap="50px"

De cijfers in de tabel vermelden de eerste browserversie die deze eigenschap volledig ondersteunt.

layout	Chrome	IE / Edge	Firefox	Safari	Opera
in het raster	66	16	61	12	53
in het elastische frame	84	84	63	14.1	70