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
Travis Bouck
5,752 Pointsresponsive website basics - padding vs margin
Just wondering if in the responsive website video if there is missing information regarding the calculation of the % for padding when converting from px to %. The video mentions margin stating that the % is based upon the parent element. I did not catch any mention of the padding conversion and went based upon the parent - now after trial and error understand that padding is on the element itself and not the parent.
I thought it was missing from the videos but then again may be me missing it.
3 Answers
Jordan Warnholtz
3,705 PointsIt's implied, but as far as I know not full-out mentioned. However, when calculating for padding you use the containers inner-dimensions, instead of the outer-containers dimensions as you do for margin. Because padding is applied inside a div, where as margin is applied to the outside of a div.
J.T. Gralka
20,126 PointsHey Travis,
Jordan's advice is a good way to think about the difference between how margins and paddings are applied. With that said, converting between pixels, ems, and %s can be frustrating sometimes, but the conversion tricks Allison teaches still hold true for margin and padding properties.
Good luck!
J.T.
Hillary Hueter
1,856 PointsIt's never stated in the margin video. I feel that's an oversight because, while the formula may be the same there's it's important to know which width to use for context.