Всем привет.

Делаю адаптивную верстку.
Сейчас у меня все меры длины (margin, padding, width, height и т.д.) сделаны в комбинации em с rem.
Т.е. зависят от размера шрифта. Соответственно, при изменении разрешения мне достаточно установить блоку нужный font-size, а все остальное автоматически изменится в зависимости от нового размера шрифта. Вроде бы прикольно ...

Но пришла в голову мысль: а нельзя ли полностью сделать все автоматическим?
К примеру, завязать размер шрифта на ширине блока, в котором он лежит, а ее (ширину блока) сделать в процентах относительно чего-нибудь (родителя, к примеру).

Тогда при изменении разрешения автоматически изменится ширина блока, под нее подстроится размер шрифта, а после - все отступы и прочие стили, которые на нем завязаны. И в @media вообще ничего писать не придется.

Кто-нибудь может подсказать, можно ли такое сделать средствами css?
Или я изобретаю велосипед и усложняю задачу?
Ну естественно, интересует кроссбраузерное и кроссдевайсное решение :)

Прочитал про юниты vw и vh. Но методом эксперимента выяснил, что их не поддерживает сафари 5.1.7, который у меня установлен.
Остальные браузеры (хром 52.0.2743.116 m, опера 39.0, фокс 47.0.1 и ИЕ 11) их поддерживают (вер

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

Просто тогда получается, чтобы при изменении разрешения все пропорционально смасштабировалось, нужно в @media уменьшать размер шрифта для текущего блока / блока-родителя / корневого элемента, в зависимости от условий.

Ну, что ж, нет - так нет.
Спасибо за ответ!