font-size: large looks different in IE 8 quirks vs. standards mode

I'm working on taking an internal enterprise website that currently requires IE 8 quirks mode to render correctly, and modifying it so that it renders in IE 8 standards mode. One of the issues that is plaguing me is the vastly different appearance of font-size: large (and possibly other font settings, this is the first I noticed).

Using this HTML as a sample:

<html>
    <head>
        <title>IE 8 Quirks Font Size</title>
        <style type="text/css">
            #testDiv
            {
                font-size: large;
            }
        </style>
    </head>
    <body>
        <div id="testDiv">Here is some text</div>
        <div>And some unstyled text</div>
    </body>
</html>

If you look at that in IE 8 with quirks mode vs. standards mode, here is the difference in appearance:

Obviously the entire site is styled assuming the layout of quirks mode. What I'm looking to find is:

Documentation on how IE quirks mode versus standards mode treats fonts differently
Some explanation on how to tweak CSS so that it renders like it used to
Ideally some magic site-wide CSS that essentially makes fonts render as if quirks mode was still in play

Solution

The problem with font-size in quirks mode is that when using medium, large, x-large etc, the browser is always showing the font as one step larger than in standards mode.

This means large in quirks mode is the same as x-large in standards mode.

Try changing your code to this:

<html>
    <head>
        <title>IE 8 Quirks Font Size</title>
        <style type="text/css">
            #testDiv
            {
                font-size: x-large;
            }
        </style>
    </head>
    <body>
        <div id="testDiv">Here is some text</div>
        <div>And some unstyled text</div>
    </body>
</html>

That should give you the same result in IE 8 Standards Mode as your current CSS does in Quirks Mode.

You can read about it here: http://msdn.microsoft.com/en-us/library/bb250395(VS.85).aspx

Keyword Values of the Font-size Property

The medium value of the font-size property matches the default normal font size.

The keyword values of this property include xx-small, x-small, small, medium, large, x-large, and xx-large. With earlier versions of Internet Explorer, these values are not defined intuitively. The medium value is not the default normal font size; small is the default.