MDBootstrap flexbox generator

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

Docs

Enable flex behaviors

Direction

Justify content

Align items

Align self (affects only Item 1)

Auto margins (affects only Item 1)