The align-self property specifies the default alignment for items within the flex container.
The align-self property in CSS is used to align the selected items in the flexible container in many different manners such as flex-end, center, flex-start, etc.
flex-start: cross-start margin edge of the item is placed on the cross-start line
flex-end: cross-end margin edge of the item is placed on the cross-end line
center: item is centered in the cross-axis
baseline: items are aligned such as their baseline are aligned
stretch(default): stretch to fill the container (still respect min-width/max-width)
align-self: auto|stretch|center|flex-start|flex-end|baseline| initial;