Override the container's setting
This property sets the alignment of a single element within a flexbox container.
This property is meaningful only on elements that are directly within a flexbox container.
It overrides the container's setting for
align-items, allowing an individual element to be aligned differently from its peers.
Use one of these keywords to align the element to its peers:
|flex-start||The top [left] of the item is aligned with its peers|
|flex-end||The bottom [right] of the item is aligned with its peers|
|center||The item is aligned with its peers along the middle of its height [width]|
|baseline||The element's typographic baseline (of it's first line of text) is used for alignment with its peers|
|stretch||The item's height [width] is stretched to match its peers|