1. Align Self
The
align-self
property specifies the alignment of Individual Flex Items along the cross axis.Align Self property can have the following values:
- flex-start
- center
- flex-end
- stretch
- auto(default) and more...
If the value of
align-self
is auto
, then the align-items
value of its Flex Container gets inherited.
In the example above, try out the
align-self
property with different values by changing the flex-direction
.2. Order
The
order
property specifies the order of Flex Items in the Flex Container.Order property has the following values:
- 0 (default)
- +ve values
- -ve values
In the example above, try out
order
property with different values.
Note
If two or more HTML elements have the same order, then they will be arranged based on their source code.
3. Chat Screen Example
AFTER
