What is an “em” if the font-size of the document is specified in ems?

Question

In CSS, an em is a relative unit based on the font-size of the document. So, what exactly is an em then, if the font-size of the document itse

Answer 1

It'll be relative to whatever the browser's default font-size is, which WILL be specified in a physical size, e.g. '10pt'.

Answer 2

It will take the browsers' default value of 16px if no parent element has defined it.

Also see this: http://pxtoem.com/

Answer 3

body is not the document root element — that's a very common misconception. The parent element of body is html, whose default font size matches the browser's default font size setting (typically 16px).¹

This applies even if you set a font-size value in ems on both body and html. So if you did this:

html, body { font-size: 2em; }

Then, assuming a default font size of 16px as set by the user, html will have a font size of 32px (twice the default font size) and body will have a font size of 64px (twice of its parent, html).

---

¹ _{To be precise, the html element's default font size is the initial value, medium, which according to the spec corresponds to the preferred default font size as set by the user.}