An explanation of font-size

This is based on a newsgroup post I made to c.i.w.a.s.

CSS2 says that the font size is the "size of the font when set solid." Set solid means (as I understand it) that there should be room for any character within the height, but nothing else, as described by Roland Ericsson. So it means that all of the characters in the font (including descenders and diacritical marks) should fit within the font-height.

However, this is not the way most Postscript and TrueType fonts are defined. They generally "stick out" of their font-size boxes. Since browsers get font glyphs from the operating system, they usually just ask for the font-size they want, and then the operating system gives them something that, according to CSS, is too big. Browsers differ significantly in how they handle that problem. I've described some of the differences.

From what I've heard, font metrics contained within common fonts (and perhaps more so for less common fonts) are very often incorrect. This makes it difficult or impossible to properly implement things like 'ex' units and the 'font-size-adjust' property. It also makes me think correction of this problem (by better conformance to CSS) is unlikely.

I proposed that CSS should (somehow) define exactly how this problem should be handled so that things based font sizes (in particular, line-height) are displayed consistently across browsers. The difference is significant: line heights can appear different by a factor of 1.2 (or more, for some fonts), and other problems can also result.

Valid HTML 4.0!

(Back to Font Information, CSS Testing Information, David Baron)