Michael Stipe’s favorite way to declare font sizes

I started using ems around 2002, and I never liked it. Using ems meant having a calculator handy just to define a font that was listed at 11px in the style guide. The main issue with ems is inheritance.
If you wrote a rule like this:

li {font-size: .75em}

An li within an li would have only 75% of the font size you really wanted.
Rems, on the other hand, are only relative to the html root (thus, root em).

html { font-size: 62.5%; }
body { font-size: 1.4rem; } /* =14px */
h1 { font-size: 2.4rem; } /* =24px */

This article explains the basics:

And more advanced:


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s