By
Tascan
Всем привет.
Слышал советы, что вместо пикселей желательно использовать rem для задания размеров. Решил, в качестве эксперимента, попробовать задать для html определённый размер в пикселях, а дальше везде использовать уже rem.
И вроде всё нормально, даже очень удобно. Но под конец решил я уменьшить масштаб страницы и вот тут появились проблемы. Если использовать такой код:
html {
font-size: 10px;
}
.box {
background: red;
width: 100px;
height: 400px;
}
То по итогу всё нормально, сколько масштаб не уменьшай, результат всё те же 400px.
Но стоило изменить единицы измерения в высоте:
html {
font-size: 10px;
}
.box {
background: red;
width: 100px;
height: 40rem;
}
И вот тут уже появляется проблема. При уменьшении масштаба страницы до 50% к размеру высоты: в Google Chrome и Yandex браузерах добавляется дополнительные 80px, в Opera итоговая высота элемента увеличивается до 960 px. А вот в Firefox всё нормально и по итогу выходят те же 400px.
Подскажите в чём тут проблема? Это особенности rem или браузеров на основе WebKit?
И вообще, я понимаю, что многие советуют явно высоту элементов не задавать, но если это необходимо, то какие единицы измерения посоветуете для этого использовать?
Question
SuperJerk
Всех приветствую.
Сабж, собсно такой: имеет ли смысл на сегодняшний день, задавать размер шрифта в em? Все более-менее современные и не очень браузеры нормально зумят шрифт, который задан в px ( да и зумить страницу гораздо проще, чем лезть в настройки и менять размер шрифта ). Ну а для резины проценты, имхо, гораздо удобней.
В em меня не устраивает то, что некоторые элементы при увлечении шрифта, ломаются. Например, горизонтальная менюшка: на всю ширину, текст в em. В итоге меню лезет на новую строку... nowrap не катит.
Как исправлять подобные вещи? Использовать в таких местах px?
Link to comment
Share on other sites
9 answers to this question
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.