CSS Demo of <length> Units Relative to Font Size

Unit Relative To
rem font size of root element
rem font size of root element
em font size of element, but can inherit from parent
em font size of element, but can inherit from parent
ex font height of "x" character of element, but can inherit from parent
ex font height of "x" character of element, but can inherit from parent
ch font width of "0" character of element, but can inherit from parent
ch font width of "0" character of element, but can inherit from parent
Element Font Sizes
Square Properties
html
body
div

*Font Size inherited from html*

*Font Size inherited from body*

*Font Size inherited from div*

Font sizes and square sizes must be set.

Only inputs between 0 and 10 are accepted for font and square sizes. Lengths cannot be negative, and for display purposes we are setting the maximum value to 10.