What's inside
1 Display Flex
The `display: flex` property enables flexbox layout, allowing flexible arrangement of child elements.
2 Flex Direction
The `flex-direction` property defines the main axis direction, such as row or column.
3 Justify Content
The `justify-content` property aligns items along the main axis, distributing space between them.
4 Align Items
The `align-items` property aligns flex items along the cross axis within a flex container.
5 Align Self
The `align-self` property allows individual flex items to override the `align-items` setting.
6 Flex Wrap
The `flex-wrap` property controls whether flex items stay on one line or wrap onto multiple lines.
7 Flex Grow
The `flex-grow` property defines how much a flex item should grow relative to others.
8 Flex Shrink
The `flex-shrink` property specifies how much a flex item should shrink if space is limited.
9 Flex Basis
The `flex-basis` property sets the initial size of a flex item before it grows or shrinks.
10 Gap
The `gap` property defines the space between flex items without using margins.