# CSS Flex Box
The flexbox in CSS is a one-dimensional model, it contains flexible and efficient layouts.It is a layout model which provide easy way to arrange items in a container.Flexbox is useful to create small scale layout and responsive layouts.
𝐅𝐞𝐚𝐭𝐮𝐫𝐞𝐬 𝐨𝐟 𝐅𝐥𝐞𝐱 𝐁𝐨𝐱
Here are the features of flex Box.
* Flexibility
* Arrangement of items.
* Order and sequencing of items.
* Proper spacing
𝐂𝐨𝐦𝐩𝐨𝐧𝐞𝐧𝐭𝐬 𝐨𝐟 𝐅𝐥𝐞𝐱 𝐁𝐨𝐱
Majorly Here are two types of components in flexbox which are following.
𝟏. 𝐅𝐥𝐞𝐱 𝐂𝐨𝐧𝐭𝐚𝐢𝐧𝐞𝐫
Flex container is parent div which contains various divisions in itself.
𝟐. 𝐅𝐥𝐞𝐱 𝐈𝐭𝐞𝐦𝐬
Flex items are the items which are inside of the container div.
![](https://cdn.hashnode.com/res/hashnode/image/upload/v1675418114977/31a43ed2-a804-44ec-845d-656a99aa4b6e.png align="center")
Here is the example for creating flex Box.
```javascript
CSS Flex Box
Hello CSS FlexBox
```
𝐅𝐥𝐞𝐱 𝐁𝐨𝐱 𝐀𝐱𝐞𝐬
Whenever we work with flexbox,we always deal with two axex,which are following.
𝟏. 𝐌𝐚𝐢𝐧 𝐀𝐱𝐞𝐬
𝟐. 𝐂𝐫𝐨𝐬𝐬 𝐀𝐱𝐞𝐬
![](https://cdn.hashnode.com/res/hashnode/image/upload/v1675419365135/1df456c9-3885-41a0-92c5-8e008a478165.png align="center")
Some of the properties of flex Box are following.
```plaintext
flex-direction:row;
flex-direction:row-reverse;
flex-direction:column;
flex-direction:column-reverse;
justify-content:center;
align-item:center;
```