CSS/Eigenschaften/gap

Aus SELFHTML-Wiki
< CSS‎ | Eigenschaften(Weitergeleitet von Gap)
Wechseln zu: Navigation, Suche

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

erlaubte Werte
  • siehe Einzelwerte
  • 0
  • Länge
  • Prozentwert
  • Vererbung steuernde Werte inherit, initial, unset und revert
  • Defaultwert: * siehe Einzelwerte
anwendbar auf alle Elemente (Unterschied Tag Element Attribut)
Browsersupport Details: caniuse.com
Vererbung nein
animierbar nein
Beispiel
#grid {
  display: grid;
  height: 20em;
  grid-gap: 2em 1em;
}
Der erste Wert legt den Abstand zwischen Reihen, der zweite Wert den Abstand zwischen den Spalten fest.
Beachten Sie: Wenn kein Wert für row-gap festgelegt wird, wird der Wert von column-gap übernommen.
Die oben angezeigte Broswerunterstützung gilt nur für Grid Layout!
Empfehlung: Verwenden Sie für eine Übergangszeit weiterhin die grid-gap-Eigenschaft!

Weblinks

Siehe auch