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) The Box Model Margins

Ivana Lescesen
Ivana Lescesen
19,442 Points
Posted by Ivana Lescesen
Ivana Lescesen
19,442 Points

Why is the margin for wildlife set in px and the pading for wildlife in %

In this video

https://teamtreehouse.com/library/css-basics/the-box-model/margins

Why is the margin for wildlife set in px and the pading for wildlife in %. Also why is the padding in h3 in ems. I do not understand. Please help.

Thank you so much :)

2 Answers

Steven Parker
Steven Parker
231,236 Points
Steven Parker
Steven Parker
231,236 Points

In the case of the margins, the values given are for top and bottom. Percentage values are based on the container width, so they are not as useful for vertical values. But it could also be a case where specific amount of space is desired, independent of the window size.

The advantage of setting a value in ems is that it becomes relative to the font size. If the font size is changed at a later time, the spacing will adjust accordingly. For any given font size, the ems unit can be translated to pixels as discussed in the video.

Ivana Lescesen
Ivana Lescesen
19,442 Points
Ivana Lescesen
Ivana Lescesen
19,442 Points

Hello Steven, thank you so much for your reply, i have just one more question. Isn't it bad practice to use so many different values px % and em. is it really necessary to use so many values. Would it be possible to use em for text and px for margin. What kind of measurements do you use?

Looking forward to your answer :)

Taylor Espejo
Taylor Espejo
3,939 Points
Taylor Espejo
Taylor Espejo
3,939 Points

Hi Ivana, A little late to the party however I do believe I could provide a good opinion on this ! No, I wouldn't say it's necessary to use all the values you have mentioned - its honestly quite subjective at times; and more often than not, based on the task requirements. ( be it essential to have high accessibility, a ebook, perhaps just a image heavy webpage). Not too many examples spring to mind so forgive me ! https://mindtheshift.wordpress.com/2015/04/02/r-i-p-rem-viva-css-reference-pixel/

I don't agree with everything in the article above however I think it definitely will interest you, give it a read and let me know where you think you stand ? :)

Taylor