flex-shrinkプロパティ
flex-shrinkプロパティは、フレックスコンテナにおいて横並びの子エレメント（フレックスアイテム）が入り切らない場合に、フレックスアイテムの縮小比を指定するプロパティです。
指定されたフレックスアイテムがフレックスコンテナ内に収まるように縮小されます。
このプロパティは子エレメント（フレックスアイテム）に指定します。値は縮小比で指定し、他のアイテムとの相対比となります。
.parent {
display: flex;
}
.flex_item{
flex-shrink: 2;
}
フレックスコンテナとはdisplay:flex;が設定されたエレメントです。
似たプロパティに、flex-basis、flex-growがあります。
flex-basisは内容の幅または絶対値で指定します。
flex-growプロパティはフレックスコンテナの幅に余りがないように拡がります。
構文(Syntax)
CSS
flex-shrink: number | initial | inherit ;
DOM(JavaScript)
String = object.style.flexShrink;
object.style.flexShrink=" number | initial | inherit ";
値（Values）
| Value | 摘要 |
|---|---|
| none | 初期値（default値） |
| number | 縮小比 |
| initial | 初期値に戻す |
| inherit | 親エレメントのプロパティを継承 |
備考（Remarks）
| 初期値（Default value） | 1 |
| 継承（Inherited） | No |
| CSS Animation | Yes |
Example
flex-shrinkの例です。flex-shrinkプロパティはフレックスアイテム（子エレメント）に指定します。
フレックスコンテナはフレックスアイテムが入り切らない幅に設定してあります。
フレックスコンテナに入り切らない場合に、flex-shrinkの値からフレックスアイテムの幅が縮小されます。