CSS align-self Property

In CSS, the align-self property is used to align the chosen objects in the flexible container in a variety of ways such as flex-end, center, flex-start, and so on.




Property Values

Value Description
auto This property is used to inherit the align-items property from its parent container, or stretched if there is no parent container. It is the default setting.
stretch The default setting. Lines expand to fill the remaining space.
center Lines are packed in the flex container's  center.
flex-start Lines are packed at the beginning of the flex container.
flex-end Lines are packed at the end of the flex container.
baseline Items will be positioned along the container's baseline.
initial Returns the value of this property to its default value.

Supported Browsers

Element Chrome Firefox Safari Edge / IE Opera
align-self 21.0 20.0 9.0 11.0 12.1