CSS/Eigenschaften/row-gap

Browserunterstützung
caniuse.com

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

• eine nicht negative Längenangabe
• ein nicht negativer Prozentwert

Vererbung steuernde Werte inherit, initial, unset und revert

Standardwert

0

anwendbar auf

alle Elemente

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.

Siehe auch

• Grid Layout
• CSS/Tutorials/Grid/Implizite_und_explizite_Erzeugung#Abst.C3.A4nde:_margin_vs_gap
  Spalten (gutter) mit gap
• Flexbox: Spalten (gutter) mit gap
• Typografie/Spalten
  • column-rule-width und gap

Weblinks

• Spezifikation (W3C): row-gap
• Details: caniuse.com