I think I can use this in my current project. Yay! Simple Little Things.
/* Document level adjustments */html { font-size: 17px; }@media (max-width: 900px) {html { font-size: 15px; }}@media (max-width: 400px) {html { font-size: 13px; }}/* Modules will scale with document */.header { font-size: 1.5rem; }.footer { font-size: 0.75rem; }.sidebar { font-size: 0.85rem; }/* Type will scale with modules */h1 { font-size: 3em; }h2 { font-size: 2.5em; }h3 { font-size: 2em; }
From one of the masters: https://css-tricks.com/rems-ems/ And if you are using sass, run
$ bower install sass-rem -S
on your command line. The -S is a shortcut to save the dependency. now you can generate font-size rems with fallbacks. The project is here: https://github.com/pierreburel/sass-rem.