Flexbox, where nobody knows the exact size of anything

Flex keywords

initial, none, auto, <positive integer>

flex-wrap: nowrap
Dev Roadshow graphic (green) Dev Roadshow graphic (colour) Dev Roadshow graphic (purple) Dev Roadshow graphic (blue) Dev Roadshow graphic (green) Dev Roadshow graphic (colour)
flex-wrap: wrap
Dev Roadshow graphic (green) Dev Roadshow graphic (colour) Dev Roadshow graphic (purple) Dev Roadshow graphic (blue) Dev Roadshow graphic (green) Dev Roadshow graphic (colour)

Flexbox basics

Word
This is a sentence.
A rather short sentence.
Word
This is a sentence.
For the purposes of this example, we need a paragraph. She must have hidden the plans in the escape pod.

Free space distribution

Give me 1 unit of free space.
Give me 2 units of free space.
I'm fine, no extra space for me.
Give me 1 unit of free space.
Give me 2 units of free space.
I'm fine, no extra space for me.

Aligning flex items

1一
2二
3三
4四
5五
6六
7七
8八
9九
10十
11十一
12十二
13十三
14十四
15十五
16十六
17十七
18十八
19十九
20二十

@hj_chen