maintain fonts size with different screen resolutions

Question

what is the best practice/solution to maintain fonts size with different screen resolutions

Answer 1

You can't do that without access to information about the clients system, DPI and resolution. The best you can do in CSS is probably to use the em unit when dealing with font sizes, as it is in relation to the users default font size.

font-size: 0.8em; 

Means that the font is 80% of the default font.

Answer 2

For you to solve this, you'd have to know the DPI of the user's monitor. Using CSS "in" or "cm" units won't work, because those use a standard DPI of 72 or 96 (depending on the OS).

You can see why this isn't really solvable. Even if the monitor communicated its DPI via the two-way interface that DVI provides, that wouldn't be accessible from CSS or JavaScript. And what about two monitors of different resolutions? If you had a window straddling the gap what should happen then?

Mac OS X was long rumored to offer "resolution independence" but it hasn't showed up yet. Probably because it's a really hard problem.