Алексей Зуев: со значением line-height: 48px; не по центру располагаются. Поменял значение на line-height: 44px; и стало ровно. Ничего страшного что значение не как у основного блока?
Алексей Зуев: Все равно не пойму как вычислить значение, чтобы было по центру. Бордер 2px, сам див 48px. А мне удалось поставить по центру написав 44px.
смотрите, почему так просходит, Вы ставите высоту header 48px и бордер 2px, а внутрь вкладываете элементы и высота у них 50px. там тоже зачем-то бордер. header должен по идее иметь высоту 50px внутренних + 2px у самого себя. Т.е. header имеет размер 52px, а Вы его обрезаете
Алексей Зуев: да да. Все получилось. Не думал, что от такого параметра зависит что-то. Там вроде текста нет, но стоит параметр display: inline-block;
возможно из-за этого он считает что это строчка и ширина 16Px?
там на рисунке показана, где базовая линия проходит. а здесь htmlbook.ru/css/vertical-align свойство vertical-align: middle - выравнивание средней точки элемента по базовой линии родителя плюс половина высоты родительского элемента.