Hi,
You can use this formula to get the width of the line for a given number of characters (CPL):
Code: Select all
Width = CPL * (font-size / font-constant)
- CPL = number of characters per line.
- font-constant = a constant specified to each font.
Example with "font-family: 'Arial', sans-serif;" (font-constant = 1.91), and "font-size: 18px".
Code: Select all
<script>
var cpl = 25;
var fs = 18;
var fc = 1.91;
var width = Math.ceil(cpl * (fs / fc));
// Test
alert(width); // 236
/* 25 characters with font-size 18px and font-family Arial need 236px line-width */
</script>
- Anyway, it's not very accurate because some characters are wider than others. But is accurate for Monospace font, like "Courier New".
This formula when you have the Width and you want to get the number of characters (CPL) that fit on a line with that Width:
Code: Select all
CPL = Width / (font-size / font-constant)
Example with line of 180 pixels, "font-family: 'Courier New';" (font-constant = 1.64), and "font-size: 16px".
Code: Select all
<script>
var width = 180;
var fs = 16;
var fc = 1.64;
var cpl = Math.floor(width / (fs / fc));
// Test
alert(cpl);
/* 18 characters in a 180 pixels line-width, font-family Courier New, size 16px */
</script>
Here's some fonts with their constant:
-
Serif Fonts:
American Typewriter — 2.14
Baskerville — 2.14
Georgia — 1.91
Times New Roman — 2.21
-
Sans-serif Fonts:
Arial — 1.91
Calibri — 2.1
Helvetica Neue — 1.9
Lucida Grande — 1.91
Tahoma — 1.91
Trebuchet MS — 2.11
Verdana — 1.73
-
Monospace Font:
Courier New — 1.64