Алгоритм выравнивания элементов в CSS Grid позволяет настраивать расположение grid-элементов внутри своих ячеек по горизонтали и вертикали. 5

Для горизонтального выравнивания используется свойство justify-items. 5 Оно определяет расположение всех grid-элементов внутри ячеек по всей сетке. 5 Возможные значения: start (выравнивает элементы по началу ячейки), end (выравнивает элементы по концу ячейки), center (центрирует элементы внутри ячейки), stretch (по умолчанию) (растягивает элементы, чтобы они заполнили всю ширину ячейки). 5

Для вертикального выравнивания используется свойство align-items. 5 Оно определяет расположение всех grid-элементов внутри ячеек по всей сетке. 5 Возможные значения: start (выравнивает элементы по началу ячейки), end (выравнивает элементы по концу ячейки), center (центрирует элементы внутри ячейки по вертикали), stretch (по умолчанию) (растягивает элементы, чтобы они заполнили всю высоту ячейки). 5

Также для выравнивания отдельного grid-элемента по горизонтали используется свойство justify-self, а по вертикали — align-self. 3