CSS rem (rem)

Rem stands for root em, and it's another rela­tive unit based on font size. Unlike em, it doesn't refer to a direct parent, but the font size of the entire HTML docu­ment. For this reason, it is a good prac­tice to define the font size for the whole web page and then refer to this value using rem. In contrast to em, even in complex struc­ture, rem doesn't require many calcu­la­tions as it's not affected by inheritance as em units are.

The rem unit acts as an em on the entire docu­ment scale. On web pages, setting an element's dimensions in rem allows you to scale the font size with JavaScript. When construc­ting scalable macro­-ty­po­graphic schemes, rem is used to maintain specific proportions of the font size of indi­vi­dual elements, the spacing between them and the line spacing.