Through my research on CSS, I've run into quite a few sites that just don't seem to understand the difference between "rem" and "em" ... in particular, they reference "em" incorrectly.
Historically, an "em" is calculated as the height and width of current font. In printing terms, the default is 12pt. In terms of CSS, 12pt = 16px.
Unless you secify differently, your website html is set at 16px. An "em", therefore, would be equal to 16px ... that is an "em" is equivalent to the most recent font-size. If you change font size to 20px within a div, an "em" within that div is equivalent to 20px. "em" is variable based on the last font-size used.
I personally never use "em" because it can cause problems in pages with fluctuations on font-sizes thoughout.
"rem" has a reference point that never changes. "rem" stands for root em. It also is based on a font-size ... the font-size of the root, and the root is the size specificied in html. If not specified, the default is 16px.
There are advantages to using "em" and advantages to using "rem". Don't get caught up in descriptions that suggest an "em" is the same as a "rem".