CSS: align-self (for flex items)
align-self
-
Property
align-selfis for a item in Flexbox. (or grid item) - It override the generic align-items (flex cross axis).
- Aligns item along the cross axis.
-
align-selfhas no effect if the container is notdisplay: flexordisplay: grid. - If a flexbox item's cross-axis margin is auto, then align-self is ignored.
Example. flex-direction row
in this example, we have flex-direction row.
1 stretch
2 baseline
3 center
4 flex-start
5 flex-end
Example. flex-direction column
in this example, we have flex-direction column.
1 stretch
2 baseline
3 center
4 flex-start
5 flex-end
Possible Values
see
auto-
Inherits from parent's
align-items(default)