rem vs em

Jeremy Church put together a nice little side by side comparison of REM and Em (and PX).¹

Both REM and EM are relative units. The difference is in what they’re relative to.

• EM is relative to the parent.
• REM is relative to the root (hence the R).

From Jeremy:

Whileemis relative to the font size of its direct or nearest parent,remis only relative to the html (root) font-size. I like to think of it as a reset. If a style sheet is built in a modular fashion, thenremshouldn’t be needed very often, but it can be handy at times.

Resources:

• ¹ Confused About REM and EM? | Jeremy Church