Какие основные отличия CSS-свойств align-items и align-self в flex-контейнерах?

Основное отличие CSS-свойств align-items и align-self в flex-контейнерах в том, что первое задаёт выравнивание всех элементов одновременно, а второе позволяет настроить выравнивание отдельных элементов. habr.com webdesign.tutsplus.com

align-items выравнивает содержимое контейнера вдоль поперечной оси. skillbox.ru У свойства есть пять возможных значений: skillbox.ru

• flex-start — элементы выравниваются по верхнему краю контейнера; skillbox.ru
• flex-end — элементы выравниваются по нижнему краю контейнера; skillbox.ru
• center — содержимое контейнера выравнивается по центру; skillbox.ru
• baseline — элементы выравниваются по базовой линии текста, который в них содержится; skillbox.ru
• stretch — внутренние элементы растягиваются на всю высоту flex-контейнера. skillbox.ru

align-self устанавливает выравнивание отдельного flex-элемента вдоль поперечной оси, переопределяя значение свойства align-items. skillbox.ru Значения align-self задаются для каждого flex-элемента и могут быть следующими: skillbox.ru

• flex-start — выравнивает элемент по началу поперечной оси; skillbox.ru
• flex-end — выравнивает элемент по концу поперечной оси; skillbox.ru
• center — выравнивает элемент по центру поперечной оси; skillbox.ru
• stretch (по умолчанию для flex-элементов) — элементы растягиваются на всю высоту контейнера. skillbox.ru