Почему при масштабировании страницы верстка летит?

Question

[issssrt]

shl.su/Cc8
Если в хроме уменьшить масштаб страницы, то блоки друг на друга на езжают.
Как избежать такие ситуации, или это нормально?

Answer 1

[Леонид Кузнецов]

Каждому блоку задать width. Родительскому блоку задать width . Задать position relative.
Создать wrapper в котором будет находиться элементы и задать ему margin 0 auto.

Comments

[Сергей Тиракьян]

Спасибо)

Answer 2

[Vladislav Soprun]

Не могу сказать что это нормально или нет.
Но пару советов могу дать!

Так как проблемы часта из за размера шрифтов при масштабировании самый лучший и простой вариант использовать %, em, rem.

REM - CSS 3 не везде поддерживается, лучше использовать % или EM.
Для расчета EM'ов используй препроцессоры LESS или SASS.

Как правило при верстке используют гиды "grid", они всегда должны быть в %.

Answer 3

[SagePtr]

Потому что Хром не умеет нормально масштабировать с учётом дробных пикселей. То же касается и размеров шрифтов. Потому нужно всегда учитывать вероятность, что шрифт в конечном итоге будет слегка крупнее задуманного, либо ширина блока, подогнанного попиксельно, окажется слегка крупнее.