I recently was shocked to discover that changing the dpi in Windows will cause IE to scale the fonts used in a web site if the fonts use relative values (ems, percents). The effect is that the browser no longer uses 96 dpi / 16px font size as a base line, and instead uses 20px as the font base line, causing font sizes to increase, sometimes dramatically. Firefox will continue to use 96 dpi/16px as the baseline regardless of the monitor dpi, so for Firefox changing the monitor dpi will not change the appearance of a web site.
However, after playing around with it a bit, I realized I can compensate for the scaling using the expression() function in my style sheet. The final expression is:
font-size: expression(screen.deviceXDPI > 96 ? 1000 / ((screen.deviceXDPI / 96) * 16) + “%” : “62.5%”);
What I’m trying to do is scale the page to a 10px base line so that ems are easier to work with (1.4em = 14px, 2.0 em = 20px, etc). If the screen has a dpi higher than 96, then it recalculate the correct percentage by taking the screen dpi and dividing it by 96 to get the percentage increase (120 / 96 = 1.25 or 125%). It then multiples the percentage by 16 to determine what the baseline font size is (1.25 * 16px = 20px). That value is then divided into 1000 (10px * 100%) to get the new percentage (50%).
In my testing these seems to compensate for 120 dpi browsers and keeps the web page looking the same.