Hacker News Reader

how would one use em to implement something like this?

1em is your base text size (what your content should use), >1, <1 when you want larger or smaller text, point being you don't dynamically adjust and break the users font size configuration.

For example comparison with the OP's site:

- dynamic on : https://files.catbox.moe/qwa2az.png

- dynamic off: https://files.catbox.moe/glu3ud.png

Don’t you mean rem? If you use em like that you have to make sure that you don’t multiply your font size more than once when nesting elements.

Except that's exactly what you want e.g. when you want something to stand out relative to its context. For instance, you want your headings to be 150% the size of surrounding text, so when you have an info box with smaller text and a heading, that heading should not end up as tall as your main text headings.

Of course you could also have distinct heading classes or equivalent selectors for different contexts, and specify every case in rem, if that's how you like your stylesheets.

Reply on news.ycombinator.com