Complete guide to CSS flexbox

CSS flexbox is a 2-dimentional layout model that came up with CSS3.

Flexbox is not just some CSS property but it is a module that comes with a bundle of CSS properties.

Using flexbox you can align your HTML elements in 2-dimentional plain. Most of modern websites now use flexbox to create layout of their website.

It is one of the most important thing to learn in CSS. Here i have discussed all flexbox properties with their use and infographics.

Flexbox property for parent element

1. flex-direction
   
2. flex wrap

3. flex-flow

4. justify content
   
5. align-items
   [](https://www.tutorialstonight.com/css/css-flexbox.php “”)
6. align content
   https://www.tutorialstonight.com/assets/css/align-content-css.png

Flexbox CSS properties for container’s items (Child)

1. Flexbox order
2. Flex grow
3. Flex basis
4. Flex shrink
5. Flex
6. align self

Check codes and examples with complete guide of CSS flexbox.

#css #css3 #html #html5 #web-development