CSS place-self property
Description
CSS place-self property places an element horizontally and vertically. It is a shorthand property of align-self and justify-self.
Syntax
place-self : align-self justify-self
Property values
align-self
autoDefault
-
It stretches out the element vertically to fill the width of container completely.
align-self: auto;
baseline
-
It aligns the element on the baseline.
align-self: baseline;
center
-
It aligns the content at the middle of cotainer.
align-self: center;
stretch
-
It stretches the element so as fill the width of container completely.
align-self: stretch;
flex-start
-
flex-start aligns the current element at the start of flex container.
align-self: flex-start;
flex-end
-
flex-end aligns the current element at the end of the flex container.
align-self: flex-end;
justify-self
autoDefault
-
It stretches out the element vertically to fill the width of container completely.
justify-self: auto;
baseline
-
It aligns the element on the baseline.
justify-self: baseline;
center
-
It aligns the content at the middle of cotainer.
justify-self: center;
stretch
-
It stretches the element so as fill the width of container completely.
justify-self: stretch;
flex-start
-
flex-start aligns the current element at the start of flex container.
justify-self: flex-start;
flex-end
-
flex-end aligns the current element at the end of the flex container.
justify-self: flex-end;
Applicable to
It applies to block-level boxes, absolutely-positioned boxes, and grid items.
From web4college, the free CSS digger
#First 1
