Font Sizing with REM

by Tom Kenny (@tkenny)

I read this article by Jonathan Snook way back when he posted it and thought it was great but never got round to actually using it.

It looks really simple to use:

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

I’m fed up with constantly maintaining em compounding sizing issues so I’ll finally be trying this method for future projects.


Improve your design knowledge in just a minute or two a day, for free


You'll get a free email every Monday to Friday with actionable design details that will increase the effectiveness of your designs. Each one only takes about a minute or two to read.

Free. No spam. Unsubscribe anytime.

by Tom Kenny

I’m a freelance web designer and front-end developer with 9 years of experience designing for the web. Follow me on Twitter here.