DEV Community

sutharrahul
sutharrahul

Posted on

Flex Box

Flex Box is one dimensional layout. Flex box deals with layout in one dimensional at a time either as row or as a column.


.flxbox{
display:flex;

flex box has 4 main axis:

1. Row (default)

when we use display:flex out items set by default as row and the direction is left to right.

{
flex-direction: row;
}

2. Row-revers:

It set out items in revers order like

4 3 2 1 and it will show right to left.


{
flex-direction: row-reverse;
}

3. Column

It is out item in column(same as row but top to bottom)


flex-direction: column;

4. column-reverse

set items bottom to top (in revers order)
flex-direction: column-reverse;

Top comments (0)