Rem vs em

Em vs rem

1EM or 1REM (r = root em)
The difference is inheritance.
The Rem value is based on the root element (html).
What is meant here is the font size for html and not the font size for the documet body.
... Em is based on the font size of each
Parent element.

Rem vs em

/* rem */
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 (px or vw). 

/* em */
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. ---> change the menu’s font size the
spacing (paddings etc) around the menu items will scale proportionately,
independently of the rest of the layout.

Source: webdesign.tutsplus.com

Similar codes

1 vote222 views2 answers
Increase tooltip width in angular material
CSS
0 vote236 views1 answer
Enque script only on specific archive page
CSS
0 vote218 views1 answer
Css ol align center
CSS
1 vote229 views1 answer
How to change style based on screen size
CSS
0 vote245 views1 answer
Unable to locate package neo4j
CSS
0 vote244 views1 answer
Activate_bin_path
CSS
11 votes221 views1 answer
Css disable mouse events
CSS
2 votes246 views10 answers
Robux
CSS
3 votes200 views2 answers
Div rounded corners
CSS
1 vote266 views1 answer
Change order columns bootstrap
CSS Bootstrap