CSS flex-shrink Свойство

Пусть второй Flex-Item сократится в три раза больше, чем остальные:

/* Safari 6.1+ */
div:nth-of-type(2) {
-webkit-flex-shrink: 3;
}

/* Standard syntax */
div:nth-of-type(2) {
flex-shrink: 3;
}

Определение и использование

Свойство flex-shrink указывает, как элемент будет сжиматься относительно остальных гибких элементов внутри того же контейнера.

Примечание: Если элемент не является гибким элементом, свойство flex-shrink не имеет эффекта.

Номера в таблице указывают первую версию браузера, которая полностью поддерживает свойство.

Номера followed by -webkit- or -moz- Укажат первую версию, которая работала с префиксом.

Свойство
flex-shrink	29.0 21.0 -webkit-	11.0	28.0 18.0 -moz-	9.0 6.1 -webkit-	17.0

flex-shrink: number|initial|inherit;

Значение	Описание
number	Число, указывающее, сколько будет уменьшаться номенклатура относительно остальных гибких элементов. Значение по умолчанию равно 1
initial	Присваивает этому свойству значение по умолчанию. (Читайте о initial)
inherit	Наследует это свойство из родительского элемента. (Читайте о inherit)