CSS Flexbox Cheatsheet
Flexbox Container
display
Enables a flex container; inline or block.
flex-direction
Specifies the direction of the flexible items.
flex-wrap
Specifies whether the flex items should wrap or not.
justify-content
Property is used to align the flex items.
align-items
Determines the behavior for how flex items are laid out along the cross axis on the current line.
align-content
Aligns a flex container’s lines within when there is extra space in the cross-axis.
Flexbox children
order
Controls the order in which flex items appear in the flex container.
flex-grow
Allows you to define the ability for a flex item to grow.
flex-basis
This defines the default size of an element before the remaining space is distributed.
flex-shrink
This defines the ability for a flex item to shrink.
align-self
Sets the alignment for individual items.