От куда взялись лишние пиксели в верстке?

Question

[Cetrar]

Добрый день! Изучаю HTML и CSS, и проблема возникла. У меня есть блок div, и в нем есть тоже 2 блока div. Так вот, высота этих блоков, 500px, но высота wrapper'a почему то 504px... От куда взялись лишние 4 пикселя? За ранее спасибо!

P.S. Весь код ТУТ

Answer 1

[Евгений Петров]

Нужно помнить про особенности формирования строчных элементов.

#content,
#asides {
	vertical-align: top;
}

Answer 2

[ivankomolin]

Все дело в особенностях display: inline-block;

Answer 3

[Андрей]

#wrapper{line-height:0}

Comments

[Григорий]

Спасибо!

Answer 4

[killerdesign]

Certar, свойство display: inline-block ответ всем глюкам сетки – метод рендеринга шрифта в ОС отличается, в Mac OS шрифты чуток жирнее чем в Windows.

А по поводу высоты – так у вас 500рх сейчас, как показывает инспектор.