I know that a lot of us are familiar with setting the font size on the body element in our CSS to 62.5%. This means that 1em will equal 10px and helps for keeping things pixel p
Arguably, but then you lose control over your scale. Don't forget that headings will typically inherit those same sizes in proportion to their rank (i.e. will be largest,
slightly smaller). If you want to decrease those elements, you will need to use em values with a lot of decimal placeholders. Imagine
. font-size: 0.005em
Or worse, if you want fonts to be scaled larger, you could potentially be looking at font-size: 40em
or something ridiculous.
In short, 1em = 10px is much more practical for the scaled values of fonts. While a 1:1 scale might make sense on paper, it doesn't lend itself that well to sensible and maintainable CSS.