Flex

Añadir la clase .d-flex para crear un contenedor con display flex.

Añadir las clases .d-flex y .flex-row valor por defecto para que los contenderores se alineen en fila.

Añadir las clases .d-flex, .flex-row y .flex-row-reverse para que se alineen en fila de derecha a izquierda.

Añadir las clases .d-flex y .flex-column para que los contenderores se alineen en columna.

Añadir las clases .d-flex, .flex-column y .flex-column-reverse para que se alineen en columna por orden inverso.

Añadir las clases .d-flex y .flex-wrap para que los elementos se ajusten y si no caben pasen para abajo. Por defecto el valor es nowrap es decir que no hay salto de línea.

Añadir las clases .d-flex, .flex-row y .justify-start para que se justifiquen desde el principio.

Añadir las clases .d-flex, .flex-row y .justify-end para que se justifiquen desde el fin.

Añadir las clases .d-flex, .flex-row y .justify-center para que se justifiquen al centro.

Añadir las clases .d-flex, .flex-row y .justify-between para que se justifiquen inicio, centro y fin.

Añadir las clases .d-flex, .flex-row y .justify-around para crear un espacio equitativo a la derecha e izquierda de cada contenedor.

Añadir las clases .d-flex, .flex-row y .align-items-start para alinear los contendores al principio del contenedor principal.

Añadir las clases .d-flex, .flex-row y .align-items-center para alinear los contendores al centro del contenedor principal.

Añadir las clases .d-flex, .flex-row y .align-items-end para alinear los contendores al fin del contenedor principal.

Añadir las clases .d-flex, .flex-row y .align-items-stretch para alinear los contendores ocupando el alto del contenedor principal.

Añadir las clases .d-flex y .flex-row en el contenedor principal y luego cada elemento interior tendrá la clase .align-self-... para alinear los contendores dentro del contenedor principal.

Añadir la clase .d-flex al contenedor principal y luego cada elemento interior tendrá la clase .flex-fill para llenar contenedor principal.

Añadir la clase .d-flex al contenedor principal y luego un elemento tendrá la clase .flex-grow-1 para ocupar el total de espacio que dejen los demás contendores.

Añadir la clase .d-flex al contenedor principal y luego un elemento tendrá la clase .mr-auto margin right auto o .ml-auto margin left auto para separarlo de los demás contendores.