Редактировать

Полезные статьи

Bootstrap 4 - Классы для работы с flexbox

Выравнивание элементов по ширине с переносом в случае сужения страницы

<div class="d-flex flex-wrap justify-content-between">
    <div class="item">some item 1</div>
    <div class="item">some item 2</div>
    <div class="item">some item 3</div>
    <div class="item">some item 4</div>
    <div class="item">some item 5</div>
</div>

Варианты

justify-content-start
justify-content-end
justify-content-center
justify-content-between
justify-content-around

Классы для разных размеров экранов

justify-content-<size>-<type>

Вертикальное выравнивание элементов по центру

<div class="d-flex align-items-center">
    <div class="item">some item 1</div>
    <div class="item">some item 2</div>
    <div class="item">some item 3</div>
    <div class="item">some item 4</div>
    <div class="item">some item 5</div>
</div>

Варианты

align-items-start
align-items-end
align-items-center
align-items-baseline
align-items-stretch

Классы для разных размеров экранов

align-items-<size>-<type>