Чем отличаются значения baseline и middle при вертикальном выравнивании элементов?

Baseline и middle отличаются подходом к вертикальному выравниванию элементов с помощью свойства vertical-align в CSS. htmlbook.ru developer.mozilla.org

Baseline выравнивает базовую линию текущего элемента по базовой линии родителя. htmlbook.ru htmlacademy.ru Если родительский элемент не имеет базовой линии, то за неё принимается нижняя граница элемента. htmlbook.ru Baseline — значение по умолчанию. doka-guide.vercel.app

Middle выравнивает середину текущего элемента по середине родительского элемента. htmlacademy.ru Середина подсчитывается следующим образом: берётся высота символа x, делится пополам и добавляется к базовой линии. htmlacademy.ru Для табличных элементов middle выравнивает содержимое текущей ячейки по центру строки с учётом внутренних отступов (padding-box). htmlacademy.ru

Таким образом, baseline ориентирован на выравнивание по нижней линии, а middle — по центру элемента.