Какие единицы измерения лучше использовать при верстке адаптивных сайтов и почему?

Дима Турков, Почему ты так негативно воспринимаешь ответы? Тебе советы дельные дают, а ты...

когда у меня появится задача, в которой мне понадобится использовать эти величины

Эта задача всегда есть. Я же описал в предыдущем комменте про шрифты.
Вы читаете, что я написал то? (с) =)

Какие единицы измерения лучше использовать при верстке адаптивных сайтов и почему?

avr1972, Can I use rem?

Какие единицы измерения лучше использовать при верстке адаптивных сайтов и почему?

Дима Турков, Ладно, пиксельный ты наш. Вот тебе еще один аргумент против пикселей.

Я — слабовидящий человек. Для серфинга использую браузер в котором в настройках выставлен увеличенный размер шрифта. Мне так удобнее, лучше видно.

Делаем простую тестовую страницу:

<h1 style="font-size: 32px;">Heading in pixel (36px)</h1>
<h1 style="font-size: 2rem">Heading in rem (2rem)</h1>

Поясню, если не знаешь. По умолчанию в браузере размер шрифта у корневого документа равен 16 пикселям, что есть 1rem. Я взял удвоенный размер для лучшей наглядности.

Если мы откроем эту страницу при обычных настройках браузера, то увидим следующее:



Всё как и ожидается, размеры равны.

Но если мы откроем страницу в моём браузере, с кастомной настройкой, то будет совсем не то, что я ожидаю:



Пиксельный размер так и остался в пикселях. А ремы корректно увеличились, потому что увеличился базовый фонт-сайз у корня документа.

Надеюсь это убедит тебя использовать ремы хотя бы для шрифтов. Ну или хотя бы перестанешь пропагандировать заведомо неверные подходы в верстке =)

Удачной вёрстки ;)

Какие единицы измерения лучше использовать при верстке адаптивных сайтов и почему?

Дима Турков,

а сколько должен? Пойду и уменьшу на 40% для мобильного размера

минимально возможное для решения задачи — один стиль =)
Если конечно у вас не в пикселях всё =)))

Какие единицы измерения лучше использовать при верстке адаптивных сайтов и почему?

avr1972, Обстоятельный ответ на этот простой вопрос легко потянет на не хилую статью. Так что не буду вдаваться в подробности.
Хотите примеры, пожалуйста, подкину пару примитивных.

Задача. Сделать элемент, шрифт в котором будет всегда меньше родительского, внутри чего бы он не находился.
Решение.
.small { font-size: 0.75em; }

Задача. Масштабировать типографику через медиазапросы.
Решение. Задаём масштабируемым элементам размеры шрифтов в единицах rem. В медиазапросах меняем единственное правило

:root { font-size: 100%; }
@media (min-width: 1000px) { :root { font-size: 120%; } }

Задача. Сделать блок высотой в один экран
Решение.
.block { height: 100vh; }

Задача. Сохранять отношение шрифта и высоты строки
Решение. Указывать line-height без единиц измерения
body { line-height: 1.4; }

ну и так далее....

Какие единицы измерения лучше использовать при верстке адаптивных сайтов и почему?

Дима Турков, Как ты можешь найти им применение, если ты не знаешь как они работают???

Какие единицы измерения лучше использовать при верстке адаптивных сайтов и почему?

Я вот до сих пор не знаю, сколько значит 1rem или em, но мне особо не интересно, знаю только, что они зависят от чего-то. Я просто не нашёл им применения в своих задачах.

Вы потому и не нашли им применения, что не знаете специфики этих единиц.
Никогда не думали в таком ключе? =))

Какие единицы измерения лучше использовать при верстке адаптивных сайтов и почему?

Где какие нужны, там такие и используются. И не важно, адаптивный сайт или нет.

Какие есть программы для оптимизации работы компьютера?

Никакие чудо-программы, даже платные, вам не помогут.
Нужно вручную отключать всё ненужное/необязательное. Список ненужного определяется индивидуально, и не знаючи лезть не советовал бы.
А вообще с подобным вопросом лучше обратиться на профильный форум. Например oszone.net (не сочтите за рекламу).

Замена фотошопа верстальщику?

никто уже не использует фотошоп

Смелое заявление. Проверять я его конечно же не буду...

Как во Флексах центрировать по высоте колонки?

raulvodov, justify-content

Как заверстать эти элементы?

Redrica, да, это просто рисование на фоне.

Div через .header и .footer больше не нужны?

prim0, при какой?

Div через .header и .footer больше не нужны?

Поясню. не нужно смешивать разметку и оформление.
Размечайте страницу семантическими элементами. Оформляйте через классы.
И будет вам счастье.

Div через .header и .footer больше не нужны?

Одно другому не мешает

Из-за чего не работает Flex сетка?

Поясните. Непонятно, что вы имеете ввиду.
На первый взгляд всё в норме:
https://codepen.io/anon/pen/GOGqMG?editors=1100

Какие есть полезные миксины для sass (не префиксные)?

@mixin zero-first-last-margin() {
  &:first-child { margin-top: 0; }
  &:last-child { margin-bottom: 0; }
}

Какие есть полезные миксины для sass (не префиксные)?

это чтобы прямо из фотошопа значения вбивать, не заморачиваясь на перевод

@mixin letter-spacing($value) {
  letter-spacing: $value / 1000 * 1em;
}

Как решить проблему с выравниванием списков?

Бесплатный совет: не засоряйте код вендорными префиксами. Юзайте автопрефиксер
В кодпене его тоже можно включить

Как решить проблему с выравниванием списков?

Нафига здесь средний уровень? Вопрос для детсада...