Cacher is the code snippet organizer for pro developers

https://webdesign.tutsplus.com/tutorials/comprehensive-guide-when-to-use-em-vs-rem--cms-23984

Summarizing em vs. rem Difference

• Translation of rem units to pixel value is determined by the font size of the html element. This font size is influenced by inheritance from the browser font size setting unless explicitly overridden with a unit not subject to inheritance.

• Translation of em units to pixel values is determined by the font size of the element they’re used on. This font size is influenced by inheritance from parent elements unless explicitly overridden with a unit not subject to inheritance.

• rem and em units are computed into pixel values by the browser, based on font sizes in your design.
• em units are based on the font size of the element they’re used on.
• rem units are based on the font size of the html element.
• em units can be influenced by font size inheritance from any parent element
• rem units can be influenced by font size inheritance from browser font settings.

• Use em units for sizing that should scale depending on the font size of an element other than the root.
• Use rem units for sizing that doesn’t need em units, and that should scale depending on browser font size settings.
• Use rem units unless you’re sure you need em units, including on font sizes.
• Use rem units on media queries

• Don’t use em or rem in multi column layout widths - use % instead.
• Don’t use em or rem if scaling would unavoidably cause a layout element to break.