CSS/Eigenschaften/row-gap

Die Eigenschaft row-gap (grid-row-gap) legt die gutters (engl. für Rinnen), d. h. die Abstände zwischen den einzelnen Reihen fest.
Ursprünglich war sie als grid-row-gap nur für Grid Layout vorgesehen, ist jetzt aber auch für Flexbox und Mehrspaltenlayout (columns) standardisiert..

erlaubte Werte	Längenangabe oder Prozentwert Prozentwert Vererbung steuernde Werte inherit, initial, unset und revert Defaultwert: 0
anwendbar auf	alle Elemente (Unterschied Tag Element Attribut)
Browsersupport	Details: caniuse.com
Vererbung	nein
animierbar	nein

Beispiel

#grid {
  display: grid;
  height: 200px;
  grid-template-columns: 25em;
  grid-template-rows: repeat(3, 1fr);
  grid-row-gap: 1em;
}

Zwischen den Reihen wird ein gutter (engl. für Rinne), d. h. ein Abstand von 1em zwischen den einzelnen Reihen festgelegt.

Beachten Sie: Wenn kein Wert für row-gap festgelegt wird, wird der Wert von column-gap übernommen.

Empfehlung: Verwenden Sie für eine Übergangszeit weiterhin die grid-row-gap-Eigenschaft!

Weblinks

• Spezifikation (W3C): row-gap

Siehe auch

• CSS/Tutorials/Abstand/gap#row-gap