align-content: ;
Values:
start
end
center
space-between
space-aroundUsed to align the flex lines.
align-self: ;
Values:
stretch
center
start
endAlign a flex item independent from other items.
flex-direction: column;
flex-direction: column-reverse;
flex-direction: row;
flex-direction: row-reverse;Which direction to stack the items.
justify-content: ;
Values:
center
flex-start
flex-end
space-around
space-betweenUsed to align items on the main-axis.
flex-grow: ; // specifies how much an item will grow relative to other items
flex-shrink: ; // specifies how much an item will shrink relative to other items
flex-basis: ; // initial length of a flex item
flex: grow shrink basis; // shorthand Set how flex items will grow or shrink to fit in a container.
flex-wrap: wrap;
flex-wrap: nowrap;
flex-wrap: wrap-reverse;Specifies whether items should wrap or not. ( Break into new multiple lines ).
align-items: ;
Values:
center
flex-start
flex-end
stretch
baselineUsed to align items on the cross-axis.