How to layout in CSS web-design

In this article, I'll teach you?CSS Flexbox?basics so you can make your own responsive sites.

What is Flexbox?

When you're building a house, you need a blueprint. In the same way, we need a blueprint when we're making websites. And Flexbox is the blueprint. The Flexbox model allows us to?layout the content?of our website. Not only that, it helps us create the structures?needed for creating?responsive websites?for multiple devices.

FLEX BOX CHART

display:flex;

flex-direction:row | column | colimn-reverse | row-reverse;

justify-content: flex-start | flex-end | center | space-between | space-around | space-evenly 

align-items: flex-start | flex-end | center | stretch | baseline 

align-content: flex-start | flex end | center | stretch | space-between | space-around 

align-self: auto | flex-start | flex-end | center | baseline | stretch 

order: /* Any positive Value*/

flex-grow: /* Any positive Value*/

flex-shrink: /* Any positive Value*/

flex-wrap: nowrap | wrap | wrap-reverse        

Flexbox works on the?parent class, not on the child classes.