Why are fonts of the same size in "Word" and browser are different? How to force the browser to do as expected?

Question

css

Hello. I ran into an unexpected problem. The fonts that were printed from Word when drawing the site, as it turned out, are very different from those shown by browsers.



The font is the same in the system, why do they display it differently with the same sizes? And how to squeeze the style out of the browser like in Word?

Writing in css sizes not in pt, but in px or % does not help, I tried all the options, not that.

Answer 1

Because when rendering, the font is attached to the pixel grid, and as a result, in the browser and other conventional programs, the line width is the sum of the widths of all characters rounded to (sub) pixel, that is, a rounding error occurs, the larger the longer the line. A programs designed to work with documents for printing on paper and therefore respect the concept of WYSIWYG, avoid the accumulation of rounding errors, either by not linking the font to the pixel grid, or by adjusting the spacing between characters.

Answer 2

Um… but how can one judge the absolute font sizes in pixels in Word if there is at least the DPI of the document and the scale? And if you dig deep, then for sure there will be some other large-scale transformations. I don’t know how it is now, but in the days of the 97th Word, when the default printer was changed, the placement of text on pages sometimes moved out ... WYSIWYG, damn it :)
On the other hand, browser pt seems to depend on the default DPI monitor that is installed in the OS (here I can lie) .
Regarding the original question, there is probably 1 slightly crooked way out: make the text 100pt in the Word, measure its size in pixels, and then select the same size in pixels in the browser (i.e. it will not depend on the set DPI in the OS). When it is selected, then the number of points in the Word will be numerically equal to the number of percent in the browser. Those. 100pt in word = 100% in browser.

Answer 3

This, of course, is not an answer to the question, but still: Or maybe in the opera as it should, but not in the Word? If you need to transfer text for printing, focus on PDF, if you just need to show it to people on the Internet, just hammer it.

Answer 4

The font size seems to be the same, the spacing between the letters is just different, this is an additional setting that is set separately.

Answer 5

See how the font will look in Adobe InDesign (it seems to be oriented to print layout from their line, although it may be different) or another professional prepress program - there are vague doubts that both Word and Opera display incorrectly :)