Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS CSS Basics (2014) Understanding Values and Units Rem Units

Andy tran
Andy tran
7,112 Points
Posted by Andy tran
Andy tran
7,112 Points

Using Em, rem, % over pixels under what case?

I understand the functions of em, rem, % and pixels, but im not sure when it is right to use em, rem, and % over pixels. Can someone give me a specific example when to use em, rem and % over pixels?

2 Answers

Steven Parker
Steven Parker
231,269 Points
Steven Parker
Steven Parker
231,269 Points

The most common use of all those units other than pixels is to make your displays adjust automatically to different sized screens or windows. Dimensions in pixels will always be the same, but dimensions in relative units will be smaller on small screens than they are on large ones.

Proper application of relative dimensions is part of the practice known as "responsive design".

Seokhyun Wie
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Seokhyun Wie
Full Stack JavaScript Techdegree Graduate 21,606 Points
Seokhyun Wie
.a{fill-rule:evenodd;}techdegree seal-36
Seokhyun Wie
Full Stack JavaScript Techdegree Graduate 21,606 Points

Hi Andy and Steven, New devices are becoming more unpredictable regarding their screen sizes (e.g. foldable phones). I think it's worth to use ems over pixels.

It is also hard for me to adapt to new standards and functionalities, especially just after one or two lessons I've had, but I will definitely try more using em values to get more used to it as I think the responsive design is more required these days. However, there might be certain types of situations that we have to use pixel values. It would be great if I can get the answer in case anyone knows the situations when we have to use pixels.

Thank you guys for meaningful discussions.

Andy tran
Andy tran
7,112 Points
Andy tran
Andy tran
7,112 Points

thanks for your helpful answer !