В поисках развернутого определения относительных единиц em и rem наткнулась на одну занятную статью - REM vs EM – Великий спор за 2016 год (относительно свежую ).
Написано очень доступно, о разных подходах, с большим количеством примеров, пояснений и даже демкой на Codepen.
Думаю, эта статья исчерпывающе отвечает на вопрос “Когда использовать em, rem или px?” и будет интересна подписчикам рассылки от HTMLacademy (если, конечно, не указывалась ранее).
Но есть вопрос к форумчанам. Цитата из статьи:
На самом деле, плохая затея устанавливать font-size для html в пикселях (px), так как тем самым мы переопределяем установки браузера пользователя.
Вместо этого вы можете выбрать проценты в качестве значения font-size, или просто не задавайте его в html.
Заметка: font-size будет установлен в 100%, если вы сами его не задали.
html { font-size: 100% } /* это значит, что по умолчанию размер шрифта будет 16px*/
Для большинства пользователей (и браузеров), размер шрифта в 100% будет по умолчанию выдавать 16px до тех пор, пока они его не поменяют в настройках своего браузера. Хотя редко кто подобным занимается.
При верстке проекта не всегда font-size основного текста равен 16px.
К примеру, в макете Kidz Master из рассылки за август он равен 14px.
В этом случае я задавала соответствующий font-size для body - как-то сама так решила. Но теперь я не уверена в правильности этого решения.
Как же лучше поступить?
Скорее всего правильнее будет задать font-size: 0.875rem.
Но! Задать его для body или для html (хотя что-то коробит меня в этом варианте)?
Буду рада за ваши мнения по этому поводу.