MDBootstrap flexbox generator

Other tools Free MDB UI KIT

Flex item 1

Flex item 2

Flex item 3


                    <div class="h-100 d-flex justify-content-center align-items-center">
                      <h3 class="badge bg-primary">Flex item 1</h3>
                      <h3 class="badge bg-primary">Flex item 2</h3>
                      <h3 class="badge bg-primary">Flex item 3</h3>
                    </div>
                  

How to use it?

1. Download MDB 5 - free UI KIT

2. Create a flexbox with the desired settings

3. Copy the generated code and paste it into the MDB project


Enable flex behaviors

Direction

Justify content

Align items

Align self (affects only Item 1)

Auto margins (affects only Item 1)