What is a difference between display: flex and display: inline-flex?
Experience Level: Junior
Tags: CSSFlexbox
Answer
The style display: flex
will make the element a flex box container.
The style display: inline-flex
will make the element a flex box container and the container will be in-line.
Note that this won't make the flex items in-line. The style is applied on the container!
CSS
.container {
display: flex;
}
.container2 {
display: inline-flex;
}
CSS - Vertical direction
div {
display: flex;
justify-direction: column;
justify-content: spacing-around;
}
Related Flexbox job interview questions
How can you explicitly reorder items in a flexbox container?
CSSFlexbox JuniorWhat is a flex-direction property used for and what values can it have?
CSSFlexbox JuniorUsing Flexbox, how do you distribute items equally inside a container?
CSSFlexbox JuniorWhat CSS property does the value flex-end belong to and when would you use it?
CSSFlexbox JuniorUsing Flexbox, how can you align elements to right?
CSSFlexbox Junior
Chat
Oh, the operator is not available. Leave us your comments. We will answer all your questions as soon as possible.
Anonymous
Καλησπέρα.
Καλησπέρα.
Anonymous
the infinteis -3/15 so 1triition / infinet
the infinteis -3/15 so 1triition / infinet
Anonymous
e
e
Anonymous
<a href="https://inspirum.pl "
<a href="https://inspirum.pl "
Anonymous
[url]https://inspirum.pl[/url]
[url]https://inspirum.pl[/url]
LaceJaguar65
e
e
LaceJaguar65
e
e
LaceJaguar65
e
e
LaceJaguar65
e
e
LaceJaguar65
e
e
LaceJaguar65
e
e
LaceJaguar65
e
e
LaceJaguar65
e
e
LaceJaguar65
e
e
LaceJaguar65
e
e
LaceJaguar65
e
e
LaceJaguar65
e
e
LaceJaguar65
e
e
LaceJaguar65
e
e
LaceJaguar65
e
e
LaceJaguar65
e
e
LaceJaguar65
e
e
LaceJaguar65
e
e
LaceJaguar65
e
e
LaceJaguar65
e
e