Let's discuss the relative unit 'em'

I can't wrap my head around the concept of 'em'. Actually, the hole concept of spacing using units relative to the font-size is difficult for me.

Let's take a default example: responsive padding of a button.

Setting the padding of this button to use 'em' will make it relative to the font-size of the closer parent element, right?

Well, what I don't understand is, what if this parent element is a 'div', or some other elements which we do not set font-sizes?

By default, shouldn't they have the root font-size '16px'? If so, what makes it different from using the unit 'rem'? Or should i set a font-size to these elements as well?

articles, kevin’s videos and others sources to help me understand this concept is more than welcome
Was this page helpful?