Возможно, вы захотите взглянуть на следующее:
CSS: стандартный (динамический) способ централизации элемента по оси y
Есть несколько полезных ссылок, которые, вероятно, все еще будут применяться к IE9.
На основе вашего кода : вы устанавливаете высоту строки в нескольких местах. Попробуйте удалить свойство line-height:16px в вашем внутреннем div, фактически избавьтесь от внутреннего div, поскольку вертикальное выравнивание повлияет только на встроенные элементы.
Кроме того, убедитесь, что высота вашего контейнера достаточно велика для размещения текста (1.2 * 13), иначе вы можете столкнуться с проблемами, связанными с различными шрифтами или разными размерами шрифтов по умолчанию в разных браузерах.
Вероятно, происходит то, что 1,2 * 13 = 15,6, и в зависимости от того, как браузер округляет числа с плавающей запятой, это может учитывать сдвиг в 1 пиксель. Установите высоту строки 16 пикселей вместо 1,2 и посмотрите, работает ли это.
Вторая попытка :
.outer {
background-color: red;
color: white;
width: 100px;
height: auto;
padding-top: 0px;
font-family: Arial, sans-serf;
font-size: 13px;
line-height: 5.0;
}
применяется к:
<div class="outer">XXXXXXXXXX</div>
Если это что-то исправит, сделайте высоту строки достаточно большой, чтобы над / под буквой было свободное пространство. Установите высоту контейнера на auto и позвольте line-height контролировать высоту контейнера.