Flex

Utilities for controlling how flex items both grow and shrink.

Class	CSS Output
`flex-auto`	`flex: auto; }`
`flex-initial`	`flex: 0 auto; }`
`flex-none`	`flex: none; }`
`flex-1`	`flex: 1; }`
`flex-2`	`flex: 2; }`
`flex-[2]`	`flex: 2; }`
`flex-[1_1_0%]`	`flex: 1 1 0%; }`

flex-auto

flex: auto;

flex-initial

flex: 0 auto;

flex-none

flex: none;

flex-1

flex: 1;

flex-2

flex: 2;

flex-[2]

flex: 2;

flex-[1_1_0%]

flex: 1 1 0%;

Reference

MDN ↗

CSS Properties

flex