align-self

При помощи этого свойства можно выровнять один или несколько элементов по вертикальной оси иначе, чем задано у родительского элемента.

В этом примере у родителя задано выравнивание вложенных элементов по верхнему краю родителя. А для элемента с классом .item мы задаём выравнивание по нижнему краю.

        
          
          .container {  display: flex;  align-items: flex-start;}.item {  align-self: flex-end;}
          .container {
  display: flex;
  align-items: flex-start;
}

.item {
  align-self: flex-end;
}

        
        
          
            
            Скопировать
            Скопировано
            Не удалось скопировать
          
        
      

Иногда требуется все флекс-элементы выровнять по вертикальной оси одним образом, но один или несколько из них выровнять иначе.

Все значения этого свойства совпадают со значениями свойства align-items.