Стоит ли полностью переходить от px к em?

Question

[Alexander Lashchevsky]

Здравствуйте!

Сейчас я повсеместно использую указание размеров в px:

<div class="container">Содержание блока</div>

.container {
   width: 200px;
   padding: 5px;
   font-size: 16px;
}

Стоит ли заменить все px на em?

Что мне принесет меньше проблем при вёрстке? С учётом того что сайт должен нормально отображаться и на стандартных мониторах, и на десктопных retina, и адаптивно на мобильных?

Answer 1

[Сергей Протько]

Если относительные еденицы измерения вам подходят - то да, имеет смысл переходить на em/rem. Если нужно указывать точные размеры - px.

Comments

[Alexander Lashchevsky]

А если мне они в целом подходят, но есть элементы (вроде инфографики, написаной кодом) где нужны очень точные размеры? :)

Answer 2

[teotlu]

Всё зависит от задачи. Если сайт адаптивный, очень желательно использовать em, а лучше rem (они теперь поддерживаются всеми браузерами, начиная с IE9). Это позволит избежать массы проблем.
Если есть вероятность, что нужно будет изменить коэффициент масштабирования всего текста на сайте, или большей его части ("сделайте весь текст чуть больше, пожалуйста"), тоже лучше использовать относительные величины.

Для всего остального можно спокойно использовать px. Мы недавно начали делать приложения для мобильных с помощью Cordova, используем Framework7 — у него в стилях тоже всё через px, хотя вёрстка для мобильных.

Но для адаптивных сайтов это тоже не жёсткое правило. Если переход на em затруднителен, а адаптив не требует пропорционального уменьшения всего текста, можно обойтись и px. Вопрос в том, насколько сайт велик и как он разрастётся в будущем.

Плюс, никто не мешает использовать частично em, частично px. Элементы, требующие точных размеров, определённых в px, можно в медиазапросах указать отдельным блоком css. Безграничный простор для творчества, в общем :)

Answer 3

[asd111]

rem