Introduction to CSS Flex Box. Flex box is a layout model for making efficient layouts for web design. It controls alignment and distribute proper space among items.
Use of Flex box
Using flex box provides us the following benefits.
- alignment
- proper spacing
- item arrangement
- order of items
Terminology
Flex box is divided in two parts
- Flex container
- Flex items
There are two axis known as flex axis. These are
- Main axis
- Cross axis
Axis start from main-start and end at main-end. From main-start to main-end, it is known as main-size.
View more proper image here.
Flex-box is a study of properties of flex-container and flex-item.
In the next, tutorial we will study the properties of flex-container.