Как выровнять элементы формы
 

Как выровнять надпись, текстовое поле и кнопку в таблице?
смотреть тут

И самое главное, почему такой результат?

1. Табличная разметка обязательна.
2. Использование тега button обязательно, в кнопке должна быть картинка.

fedushok,

table td {
       line-height: 0px;
    }

Я знаю, но не совсем понимаю насколько обоснованно применять свойства для текста к интерфейсным элементам.

Почему кнопка "чудит" и каким образом line-height=0 влияет на её положение?

fedushok,
ждите знатоков css

table td *{
  vertical-align: middle;
}

У элементов baseline разный.

Возможно имеет больше оснований говорить о том, что у текста baseline не совпадает с baseline у input и button. У input и button baseline скорее всего проходит одинаково, но кнопка проявляет "индивидуальность". (1) Как узнать где baseline проходит у не текстовых элементов?

Кстати если в кнопку ввести текст, происходит её выравнивание относительно надписи и input без всяких стилей. У input скорее всего baseline проходит через baseline потенциально вводимого текста. Если предварительно ввести текст в input, становится видно, что все элементы вроде как выравниваются по baseline текстовой надписи.

(2) Если предположить, что мнение "У элементов baseline разный." верно, то как определить ту логику с которой baseline назначается для кнопки? Явно, что baseline у кнопки не проходит через середину.

Тут вам надо в спецификацию html смотреть, и не факт что поможет.)