Добрый вечер, оформляю заголовки для сайта.
Отступ сверху и снизу по 9.5px + высота контейнера 13px - получается реальная высота 32 px
В этот контейнер я бэкграундом вставляю изображение (даю ему отступ сверху 9.5px) высотой 13px т.е. такой же как и размер шрифта, т.е. должно получится 9.5px+изображение(13px)+9.5px=32px (высота заголовка).
Но, когда я открыл в браузере, то увидел что чуть-чуть это выглядит не так как должно быть. Я сделал скрин экрана и замерил размеры отступов в фотошопе, получилось 9px - сверху, снизу - 10px.
Вопрос: Что это за округление такое???
Картинку бэкграунда и код прилагаю.
<div class='codetop'>CODE</div><div class='codemain' style='height:200px;white-spacere;overflow:auto'>h2 {
text-transform:uppercase;
font:italic bold 13px "Segoe UI";
height:13px;
line-height:13px;
padding:9.5px 0 9.5px 44px;
color:#fff;
background:#607f90 url(images/headers_pointer.gif) no-repeat 19px 9.5px;
}
<h2>hello world</h2>
</div>
upd:
ff 3.01: верхний отступ - 9px, нижний 10px
opera 9.5, ie7: верхний и нижний отступы по 9px (получилось что пропал 1px)
пойду ка я спать, эта неделя была тяжёлой
