Font sizes: EMs vs Pixels... in 2011, which one should be used? [closed]

Question

So, back in the day, it was much preferred to use EMs to pixels for font size because EMs scaled with IE6 whereas pixels did not. However, these days, every modern browser is able to scale pixel sized font correctly. EMs other advantage was that it cascades, whereas pixels do not.

That said, if one were doing web development for modern browsers and absolutely did NOT want cascading font sizes, would pixels be preferred?

I'm trying to think if there are any other drawbacks to using pixels for font size instead of EMs. Thanks!

Answer 1

While every modern browser is able to zoom with text sized using px, they can't all scale text sized using px, it still depends on the browser.

Try 'scaling' text in IE8 using zoom, absolutely fine. Scale using the official text size modifier (page -> text size -> largest), and it doesn't work.

1. IE8 - Zoom, no scale
2. Firefox 4, beta 12 - Zoom, no scale
3. Google Chrome 10 beta - Zoom, no scale

Several official bodies that I work with use the official text size modifier as part of their user/group settings management. When accounts are set up for users, they're often pre-configured using this setting. I don't know if they have to set it there ... but for me, EMs are still preferable because PX doesn't scale everywhere.

Finally, a few words from the W3C.

Units: avoid absolute length units for screen display

• Do not specify the font-size in pt, or other absolute length units for screen stylesheets. They render inconsistently across platforms and can't be resized by the User Agent (e.g browser). Keep the usage of such units for styling on media with fixed and known physical properties (e.g print).
• Use relative length units such as percent or (better) em

ref: http://www.w3.org/QA/Tips/font-size

Answer 2

One important drawback to use font size in pixels is that it becomes hard to change all web site text font size proportionally after you have finished development.

If you set the absolute font-size in one place - preferably the body element font size - and use Ems in any other size property, you can change the whole site text sizes by just changing the body element font size.

I assume that most users don't know how to scale just texts using their browser zoom capabilities and still web designers want to set a default proportion between texts, other page components and the general layout.