DEV Community

loading...

Difference btw px,em and rem

front_end_shifu_2022 profile image ・1 min read

Some Beginners do have issue of understanding the difference between px , em and rem and they get confuse. Well, honestly This also happened with me:).I want to share it in a very easy simple way maybe somebody will get benefit from it.

px:
px is an absolute unit. Changing value of another element does not effect the value of absolute units.
It's a kind of fixed value.

em:
em unit is relative to the font-size of the element being styled. This is also effected by inherited values from the parent until it is overridden by a px unit which is not subject to inheritance.

rem:
rem unit is relative to the font-size of root(html) element. It mean's that only if you make changes in root element then rem will be changed. It's not effected by inherited values from the parent.

Discussion (0)

pic
Editor guide