Народ, всем привет. Когда мы говорим о верстке сайтов, одним из самых важных понятий в CSS является box model, ну или «модель коробки», она же блочная модель. Когда-то была табличная верстка, но свершилось чудо и мы от нее ушли. Теперь, всё, что вы видите на веб-странице, будь то абзац, кнопка, изображение или целый блок — всё это по сути прямоугольные коробки. Понимание того, как они устроены, позволяет избежать множества проблем, особенно связанных с "прыгающей" версткой, сломанными отступами и непредсказуемыми размерами элементов...

Прежде, чем начать что-то делать, надо разобраться с принятыми единицами измерения. CSS поддерживает множество единиц измерения, но здесь будут описаны только самые часто-применяемые. px - пиксели Самая основная единица измерения, которая встречается практически везде - это пиксели. Пиксель - это точка минимального размера на вашем экране. Весь экран состоит из таких точек. Вообще, если мы говорим о CSS, то пиксели здесь не всегда будут равны тем самым точкам на экране. К примеру, если у вас Retina...