Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

CSS CSS Basics (2014) The Box Model Padding

set padding as percent value: the percentage is relative to the width of the box? But what's the width of the box?

I guess the width is just the content's width, not the box's width?

in the video, Guil said total width of the container, so that's equal : content + 2*padding + 2*border, but how you set padding's percentage value when the equation has padding?

1 Answer

Emma Willmann
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Emma Willmann
Treehouse Project Reviewer

The width of the box doesn't really matter. The box could be a set width (500px) or a percentage width: (46%). When they say to set the padding to a percentage of the width, the padding will be x% of whatever the width of box is. So, if you set the padding at 5% and the box is a 500px width, then the padding will be 25px. But, if the width box is a percentage of 46%, then 5% will calculate based off that...so, if the browser is resized, the width of the box is resized automatically, and so will the padding.

thanks, that make sense

actually I find the percentage is relative to the box's containing elements.