2 ms·
> Unfortunately rems are not supported on certain (older) browsers. Poor argument, especially since IE9 supports them, and IE shouldn't be supported anyway. I
by ravenstine 7y ago
> Unfortunately rems are not supported on certain (older) browsers.
Poor argument, especially since IE9 supports them, and IE shouldn't be supported anyway. I suppose people needed to back in 2013.
> With the rem unit we have a problem though. Since all font-sizes are relative to the root element, the font-size: 90%; rule is completely ignored. We now have to recalculate and override every font-declaration in the aside to get the same result. Spaghetti is wonderful as lunch or dinner, but not as code.
At this point, I question whether it's even necessary to use percentages for font sizes deeper in the DOM than the root element. Unless the font is going to change at any given viewport width, it's easier to just write the font sizes for every screen breakpoint you have. I don't know why developers/designers make things unnecessarily difficult. Most web designs don't necessitate this kind of complexity.
> The rem unit is buggy
This was fixed years ago. Try it yourself in today's Chrome.
> Another reason why some people prefer rem over em is because inheritance is hard. I always tell these people they’re doing it wrong.
No they're not. They're using rem to properly support the user's right to set the font size in their browser preferences and have it actually work on a webpage. They're not using em because they probably don't need it. If they didn't care about the user's font preferences, they'd probably use px because it's easier for everyone to understand.
> The inheritance problem occurs when we nest a p in a li. The p will now be 1.2 × 1.2 = 14.4 pixels. This is too big. To make sure that a p in a li is 12 pixels too we now have to write extra, increasingly complex code:
So don't do that. Write your font sizes explicitly for each element, whether it's px or rem.
Even better if you use a preprocessor like SCSS that supports variables and mixins, which makes it even simpler to implement "flexible" font sizes without the insanity of making font sizes in elements relative to other parent elements. Even CSS variables that are now becoming ubiquitous help solve these problems.
Despite those things, I still insist it's possible to avoid these headaches by just not going the em route. They're rarely necessary.