Atributo flex-shrink do CSS

Definição e uso

A propriedade flex-shrink está fixada no mesmo contêiner, a quantidade de contração do item em relação aos outros itens flexíveis.

Nota:Se o elemento não for um item flexível, a propriedade flex é inválida.

Faz com que o segundo item flexível contraia três vezes mais que os outros itens:

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

flex-shrink: number|initial|inherit;

Valor	Descrição
number	Número, que define a quantidade de contração do item em relação aos outros itens flexíveis. O valor padrão é 1.
initial	Defina essa propriedade como seu valor padrão. Veja initial.
inherit	Herda essa propriedade do elemento pai. Veja inherit.

Valor padrão:	1
Herança:	Não
Produção de animação:	Suportado. Veja:Propriedades relacionadas a animação.
Versão:	CSS3
Sintaxe JavaScript:	object.style.flexShrink="5"

Os números na tabela indicam a primeira versão do navegador que suporta completamente essa propriedade.

Números com -webkit- ou -moz- indicam a primeira versão com prefixo usada.

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