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


Corbin Balzan
Corbin Balzan
11,751 Points

1em does not equal 100%?

I am trying to use an adjustable unit for the padding of list items. I used percentage and em interchangeably (setting max-width of the body to 90%) but when I went to change them 1em did not equal 100% and vice versa. Why would this be happening?

2 Answers

18,814 Points

Without seeing your code, it's difficult to say for sure. You definitely don't want to use em and percentages interchangeably.

One em is equal to the currently specified point size. So by default, 1em is equal to 16px. It doesn't translate well to a percentage.

When defining a percentage width, you are comparing it to the width of the parent element. So if you say the max width of the body is 90% that will be 90% of the window (usually).

1 em is equal to your currently chosen font size - mostly it is 16px.