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 Padding

Konrad Dziekonski
Konrad Dziekonski
7,798 Points

scaling in px and %

Hi

I have just tried and it looks that no matter if we set padding in px or % the browser rescales the div in the same way, could You explain furter what is a good practice and when to use which? Thanks

2 Answers

Steven Parker
Steven Parker
231,007 Points

If these units look the same, then the containing element of the one you're setting must just happen to be about 100 pixels wide.

And you'd typically choose px units if you want a consistent size for something, and a percentage unit if you wanted it to adapt to the size of its parent element (which might possibly be relative to the window size).

KAMRAN IMRANLI
KAMRAN IMRANLI
4,107 Points

Steven Parker So Guil mentions that when we set the padding in percentages, for example, 50%, it takes the 50% of the width of the container. And when I make it 100% it becomes the whole browser window. So does this mean that the percentage value is related to the width of the browser window but not the width of the container?

Steven Parker
Steven Parker
231,007 Points

The percentage is relative to the parent container. If 100% makes it the whole browser window then the parent element must already be that size.