Bootstrap 4 Flex - All In One

Bootstrap 4 Flex Utilities - All In One

1. d-flex (Row)

Item 1

Item 2

Item 3

2. flex-column

Column 1

Column 2

Column 3

3. justify-content-between

Left

Center

Right

4. align-items-center

Center 1

Center 2

5. flex-wrap

Wrap 1

Wrap 2

Wrap 3

Wrap 4

6. order classes

Order 3

Order 1

Order 2

7. ml-auto

Start

End

8. align-self

Start

Center

End

9. Responsive Flex (column on small, row on md+)

Responsive 1

Responsive 2

Responsive 3