row, column
row
main axis horizontal
column
main axis vertical
justify-content, align-items, align-content
justify-content
align elements on main axis
align-items
align elements on cross axis
align-content
if content more than one line, distribute space around each line across cross axis
CHILDREN => order, flex-grow, flex-basis, flex-shrink, align-self
order
change order, make item display before another item
flex-grow
grow an item and take avilable space if necessary
  • 1, then every child will take equal, 2 means child will take twice space than others
flex-basis
initial size of item before space is allocated
flex-shrink
how much the item will shrink relative to other items
align-self
align individual item