HTML: How common is it that different browsers ren

Question

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

Question: Can I rely on the ratio of px and em to be the same across browsers? If not, then my manually specified margins between paragraphs will likely look odd because they so not match 1em anymore.

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

Answer 1

No. ems are relative to the user's chosen font size, px aren't. The default font sizes of desktop browsers are about the same in pixels, but mobile devices in particular will vary even before user adjustment.

You should use em for a margin in text content that should be sized similarly to the surrounding fonts, and px for a margin that has to line up with images used by the page layout.

Answer 2

No, you cannot.

The size of em in pixels is related to the font type & size you're using, the resolution of your screen (depending on OS, browser), and possible further OS and browser settings - eg "Show fonts +10%" may alter the em value.