CSS flex-shrink Eigenschaft

Definition und Verwendung

Die flex-shrink-Eigenschaft bleibt im selben Container, die Schrumpfmenge des Elements im Vergleich zu den übrigen elastischen Elementen.

Anmerkung:Falls das Element kein elastisches Element ist, ist die flex-Eigenschaft ungültig.

CSS Referenzhandbuch:flex-Eigenschaft

HTML DOM Referenzhandbuch:flexShrink-Eigenschaft

Der zweite elastische Element wird im Vergleich zu den übrigen Elementen dreimal so stark geschrumpft:

div:nth-of-type(2) {
  flex-shrink: 3;
}

flex-shrink: number|initial|inherit;

Wert	Beschreibung
number	Zahlen, die die Schrumpfmenge des Elements im Vergleich zu den übrigen elastischen Elementen bestimmen. Der Standardwert ist 1.
initial	Diese Eigenschaft wird auf ihren Standardwert gesetzt. Siehe initial.
inherit	Diese Eigenschaft wird von ihrem Elternelement geerbt. Siehe inherit.

Standardwert:	1
Vererbung:	Nein
Animationserstellung:	Unterstützt. Siehe:Attribute für Animationen.
Version:	CSS3
JavaScript-Syntax:	object.style.flexShrink="5"

Die Zahlen in der Tabelle verweisen auf die erste Browser-Version, die die Eigenschaft vollständig unterstützt.

Zahlen mit -webkit- oder -moz- beziehen sich auf die erste Version, die den Präfix verwendet.

Chrome	IE / Edge	Firefox	Safari	Opera
29.0 21.0 -webkit-	11.0	28.0 18.0 -moz-	9.0 6.1 -webkit-	17.0