Flexbox Grids

Property: `flex`

Default: flex: 0 1 auto (grow, shrink, basis)

1
flex: 0 1 auto

2
flex: 0 1 auto

3
flex: 0 1 auto

4
flex: 0 1 auto

flex: 1 is the same as flex: 1 1 0%

1
flex: 1

2
flex: 1

3
flex: 1

4
flex: 1

5
flex: 1

6
flex: 1

7
flex: 1

8
flex: 1

Flex items stick to 25% width (works due to flex-wrap: nowrap, thus only for one row)

1
flex: 1 1 25%

2
flex: 1 1 25%

3
flex: 1 1 25%

4
flex: 1 1 25%

Example from flex-basis section, now combined with other properties

1
flex: 0 1 25%

2
flex: 1 1 auto

3
flex: 1 1 auto

4
flex: 0 1 50%