Does the CSS 'font-size: medium' set font to .Body font size or to the *browser*'s base font size?

Question

in "CSS: The missing manual" the author says that font-size: medium (or other size keywords) sets the font relative to the browser's base font size.

But what I'm seeing in FF2 and IE6 is that it sets the font size to what I specified in the .CSS HTML or BODY style (which is much preferred).

If it works the latter way, this is very handy if you have nested styles and you know you want some text to be the body font-size (i.e., "normal sized text").

Answer 1

I think if you set a default size to a element like a container or the body, then any relative font-sizes in the children are based on the parent elements. Only if you don't specify a font-size anywhere does it just default to the browser (which they all have different sizes at that).

Answer 2

From the CSS 2.1 specification:

The 'medium' value is the user's preferred font size and is used as the reference middle value.

If a browser doesn't do this, then the browser is buggy.

Answer 3

It will be based upon the parent element, so as to respect the cascade. If it is helpful, I always do my font sizes this way:

body {
   font: normal 100% "Arial","Helvetica",sans-serif;
}
p, li, td {
   font-size: .85em;
}
li p, td p {
   font-size: 1em;
}

Go 100% on the body, then use em for everything else. I never use "smaller" or "medium" or anything like that. I have more control this way.

Edit:

Please see Jim's comment about "medium" being an absolute font size. Good to note.

Answer 4

Font Size Keywords (xx-small, x-small, small, medium, etc..) are based on the users default font size which is medium. It can also be used in the term of changing the size of a child element in relation to the parent element.