Flex Container properties
Item #1
Item #2
Item #3
.container {
flex-direction: row;
}
Item #1
Item #2
Item #3
.container {
align-items: stretch;
}
Item #1
Item #2
Item #3
.container {
justify-content: flex-start;
}
Item #1
Item #2
Item #3
Item #4
Item #5
Item #6
Item #7
Item #8
Item #9
.container {
align-content: stretch;
}
Item #1
Item #2
Item #3
Item #4
Item #5
Item #6
Item #7
Item #8
.container {
flex-wrap: nowrap;
}
Flex Items properties
(for Item#2)
Item #1
Item #2
Item #3
.item2 {
align-self: auto;
}
Item #1
Item #2
Item #3
.item1 {
flex-grow: 0;
}
Item #1
Item #2
Item #3
.item1 {
flex-shrink: 1;
}
Item #1
Item #2
Item #3
.item1 {
order: 0;
}
Item #1
Item #2
Item #3
.item1 {
flex-basis: 33%;
}