CSS display-flex
flex-direction
row
row-reverse
column
column-reverse
flex-wrap
wrap
wrap-reverse
nowrap
flex-grow
Red:
0
1
2
3
Yellow:
0
1
2
3
Green:
0
1
2
3
flex-shrink
Yellow:
0
1
2
3
justify-content
Positional alignment:
center
start
end
flex-start
flex-end
left
right
Normal alignment:
normal
Distributed alignment:
space-between
space-around
space-evenly
stretch
Overflow alignment:
safe center
unsafe center
Global values:
inherit
initial
revert
revert-layer
unset
References:
mdn web docs article on flex
CSS-Tricks article on Flexbox
Bootstrap 5.3 Flex classes