HTML: How common is it for different browsers to display 1em at different actual pixel sizes?

As you know, you can specify sizes with CSS in px or em. As far as I understand, em means "line height of the current element fonts". My current approach is to always use points (also for profit, which seems to be a controversial practice).

Question: Can I rely on the ratio of px and em to the same thing in browsers ? If not, then my manually set fields between paragraphs most likely look weird because they no longer match 1em.

I believe that it is better to use em for fields, but I have a pretty base of existing code that always uses px fields.

+3
html css cross-browser browser
source share
2 answers

No , you can’t.

The size of em in pixels is related to the type and size of the font, the resolution of your screen (depending on the OS, browser) and possible additional settings of the OS and browser - for example, "Show fonts + 10%" can change the value of em .

+3
source share

Not. em refers to the font size selected by the user, px does not. The default font size for desktop browsers is approximately the same in pixels, but mobile devices, in particular, will differ even before the user setting.

You should use em for the field in the text content, which should be similar to the surrounding fonts, and px for the field, which should match the images used by the page layout.

+7
source share

All Articles