Simple guide of Flexbox in Real Life🔥Part #2
Kevin Coto🚀💡
Posted on June 18, 2021
If you have come until here you are prepared for working with Flexbox in real projects, but first read all this article.
An interesting property: wrap
First, we let's talk about the wrap
, wrap
is so useful property to defined If our items it adjusting in one line or allow the items to wrap as needed with this property.
It has 3 properties:
nowrap
(default): all flex items will be on one line
wrap
: flex items will wrap onto multiple lines, from top to bottom.
wrap-reverse
: flex items will wrap onto multiple lines from bottom to top.
A combination between wrap
and flex-direction
: flow
If you needed use flex-direction and wrap in the same element, so flow is your solution to save your time and create more clarity and professional code
This is an example of how use this property:
.div {
flex-flow: column wrap;
}
I know that you are waiting for more property but I'm sorry it does not have more so important properties, If you want to read more about all flexbox properties clicking this URL, sorry it's a monetizable URL with them I pay my tomatoes
Posted on June 18, 2021
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.