What CSS property does the value flex-end belong to and when would you use it?
Experience Level: Junior
Tags: CSSFlexbox
Answer
The value flex-end
can be assigned to a CSS property justify-content
or align-content
.
The combination of justify-content: flex-end
will move the flex items to the end of the main axis. You usually use it to align the horizontally flowing items to right or vertically flowing items to bottom.
The combination of align-content: flex-end
will move the flex items to the end of the secondary (perpendicular) axis. You usually use it to align horizontally flowing items to bottom or vertically flowing items to right.
CSS
div {
display: flex;
justify-content: flex-end;
align-content: flex-end;
}
Related Flexbox job interview questions
What is a difference between display: flex and display: inline-flex?
CSSFlexbox JuniorUsing Flexbox, how do you distribute items equally inside a container?
CSSFlexbox JuniorUsing Flexbox, how can you align elements to right?
CSSFlexbox JuniorWhat does justify-content CSS property do and what values can it have?
CSSFlexbox JuniorHow do you turn a html element into a flex container?
CSSFlexbox Junior