Web Typography: Using The Golden Ratio and REM's - Greg Rickaby - 0 views
-
First you need to set a default “root” font-size variable: html { font-size: 62.5% } Why 62.5% instead of 100%? Simplicity. Our default font is now 10px, which makes math easier. Now, 1.0rem = 10px. This becomes our $rembase.
-
Now your fonts will scale perfectly during a browser re-size (if using responsive design), or if a user were to zoom in or out.
-
What’s so awesome about the unitless line height? You only have to specify it once in the <body> tag. Now, ALL other line height(s) are relative to the parent font-size. That’s too easy! (Of course, you can still specify your own to maintain complete control.)
-
Shouldn't line-height also be refined whenever the container width changes?
-
- ...5 more annotations...
