Is this formula for approximating the number of characters in a line in a div correct?

I came across a website that says

In the previous example, column 1 has a fixed width: it has a width of 400 pixels. With text rendering at 12 pixels, this will result in approximately 66 characters per line. If your reader increases the size of the text to 16 pixels, then the rate decreases to 50 characters per line.

CSS for its column 1 DIV#col1 { width:400px }

At the moment, I'm not so concerned about the situation when the reader increases the size of the text.

I don’t understand where he gets his coefficients from, but this formula apparently explains both of the relationships he gives:

 approximate charcount per line = [2 * (div width)] / (font size) 

The units in the formula are pixels ...

He gives two more examples later, and the formula still seems ...

Is this formula correct? Why does he give this relationship?

I would have thought someone asked about this before, but maybe I have the wrong search terms :)

+7
source share
2 answers

The examples and the formula and notes on the cited page come down to the simple idea that the width of the character is half the size of the font.

This is just a rough rule and not very accurate, even average. The width depends on the font and character. "Average character width" is a very vague concept. In a print shop, for example. Robert Brinhurst’s Typographic Style Elements uses the length of the lowercase English alphabet (a to z) as a measure, but it actually means calculating the average of these letters, as if the texts consisted only of them and with each character equally frequent.

In fact, the average width of characters in English prose seems to be closer to 0.4 font size, not 0.5.

In conclusion, if you want to set the column width to, say, 50 characters, then a sensible attempt:

 width: 20em; width: 50ch; 

Older browsers that do not support the CSS3 ch block will use 20em , which corresponds to a score of 0.4. You can use a slightly larger ratio, or significantly more, if you have verified that your basic font suggestions are for fonts where the characters are relatively wide. But this is not an exact science. Even using the ch block is not an exact science, since it simply denotes the width of the zero digit (0), although this can be considered as a reasonable approximation of the "average character width".

+8
source

The pixel size for the font gives the height with a width corresponding to the ratio. The only way to be sure of the number of characters is to use a monospace font. They say it sounds right. The only way to know for sure is to check the font that you are using (since they can vary significantly in the ratio of height and width and, of course, will change with the character used).

+2
source

All Articles