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 trialCindy Truong
9,853 PointsMax-width, margin, and padding. What is the difference?
If you want an element to be a certain size can't you just use max-width only? I'm having a hard time understanding when I have to use padding or margin.
2 Answers
Robert Bennett
11,927 PointsIt would be good to learn the box model. The max-width property is used to set the maximum width of an element. This prevents the value of the width property from becoming larger than max-width. The value of the max-width property overrides width.
Explanation of the different parts called = box model:
Content - The content of the box, where text and images appear
Padding - Clears an area around the content. The padding is transparent in side.
Border - A border that goes around the padding and content
Margin - Clears an area outside the border. The margin is transparent
Robert Bennett
11,927 PointsYou are welcome... I hope you keep going in your career being a programmer/developer.
Cindy Truong
9,853 PointsCindy Truong
9,853 PointsThank you Robert! I've learned about the box model a while back, but completely forgot about it. Now it makes more sense.