CSS flex-krimp eigenschap

Definitie en gebruik

De flex-shrink eigenschap is in dezelfde container gevestigd, de contractie van het item ten opzichte van de andere elastische items.

Opmerking:Als het element geen elastische item is, is de flex eigenschap ongeldig.

CSS referentiemanual:flex eigenschap

CSS referentiemanual:flex-flow eigenschap

CSS referentiemanual:flex-grow eigenschap

CSS referentiemanual:flex-wrap eigenschap

HTML DOM referentiemanual:flexShrink eigenschap

Maak de tweede elastische item drie keer zo klein als de andere items:

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

flex-shrink: number|initial|inherit;

Waarde	Beschrijving
number	Getal, dat de contractie van het item ten opzichte van de andere elastische items regelt. De standaardwaarde is 1.
initial	Stel deze eigenschap in op zijn standaardwaarde. Raadpleeg initial.
inherit	Deze eigenschap erfgenamen van de ouder element. Raadpleeg inherit.

Standaardwaarde:	1
Inheritantie:	Nee
Animatie maken:	Ondersteund. Raadpleeg:Animatiegerelateerde eigenschappen.
Versie:	CSS3
JavaScript syntaxis:	object.style.flexShrink="5"

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

Cijfers met -webkit- of -moz- voorafgaand geven de eerste versie met voorvoegsel aan.

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