monospace, serif
courier new
courier new, monospace
courier new, serif
courier new, monospace, serif
miao, monospace
miao, monospace, serif
miao, courier new, monospace
miao, courier new, monospace, serif
arial, monospace

The above boxes have padding-left:10em, and different specified font-families. Firefox and Safari have usually a default font size for monospaced fonts smaller than for the other font-families (13px versus 16px, at least in a "common" configuration.) This is shown by a different left padding in the third (at least) of the above test cases. I guess this is an attempt to counteract the fact that some common monospaced fonts appear bigger (at the same font-size) than proportional fonts. But I don't like this type of solution which, among other problems, makes monospaced text size much different amongst browsers, at least in default conditions. Moreover the default 'compensation' (13/16) appears excessive.

The smaller size seems to apply:

If a monospaced font is specified, but without the "monospace" generic family (not a good idea, but possible), then the different size is not applied, in both Safari and Firefox. A better 'solution' (see the first two references below) is using the "monospace" generic-family, but adding after it a further generic "serif" or something like that: this avoids the size problem, and still provides a monospace generic family if the previously mentioned ones are not available.


CSS tests home