Примеры урока:
«Bootstrap 4. Сетка. Подробное руководство»

2.1. Колонки одинаковой ширины

1 из 2
2 из 2
1 из 3
2 из 3
3 из 3

2.2 Установка ширины одной колонки

1 из 3
2 из 3 (широкое)
3 из 3
1 из 3
2 из 3 (широкое)
3 из 3

2.3 Контент переменной ширины

1 из 3
Контент переменной ширины
3 из 3
1 из 3
Контент переменной ширины номер два
3 из 3

2.4 Мульти-ряд

col
col
col
col
col

3.1 Брейкпоинты

col
col
col
col
col-8
col-4

3.2 На мобильных устройствах

col-sm-8
col-sm-4
col-sm
col-sm
col-sm

3.3 Создание сложной комбинированной сетки

.col-12 .col-md-8
.col-6 .col-md-4
.col-6 .col-md-4
.col-6 .col-md-4
.col-6 .col-md-4
.col-6
.col-6

4.1 Вертикальное выравнивание

Верх
Верх
Верх
Середина
Середина
Середина
Низ
Низ
Низ
Верх
Середина
Низ

4.2 Горизонтальное выравнивание

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

4.3 Удаление полей между колонками

col-6 col-sm-4 col-md-4
col-6 col-sm-4 col-md-4
col-6 col-sm-4 col-md-4
col-6 col-sm-4 col-md-4
col-6 col-sm-4 col-md-4
col-6 col-sm-4 col-md-4
col-6 col-sm-4 col-md-4
col-6 col-sm-4 col-md-4
col-6 col-sm-4 col-md-4

4.4 Перенос колонок на новую строку

.col-9
.col-4
9 + 4 = 13 колонок - это больше 12. Данный элемент шириной в 4 колонки будет перенесён на новую строку.
.col-6
Следующие колонки расположатся вдоль строки.

5.1 Классы порядка элементов

Первый неупорядоченный элемент
Второй, упорядоченный как последний
Третий, упорядоченный как первый

Первый неупорядоченный
Второй, упорядоченный как последний
Третий, упорядоченный как первый

5.2.1 Классы смещения

.col-md-4
.col-md-4 .offset-md-4
.col-md-3 .offset-md-3
.col-md-3 .offset-md-3
.col-md-6 .offset-md-3

6. Вложенность

Уровень 1: «.col-sm-9»
Уровень 2: «.col-8 .col-sm-6»
Уровень 2: «.col-4 .col-sm-6»