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

HTML How to Make a Website Adding Pages to a Website Review: Adding Pages to a Website

Kailash Seshadri
Kailash Seshadri
3,087 Points

padding vs margin?

what is the difference between margin and padding?

2 Answers

Erik S.
Erik S.
9,789 Points

Padding is applied to the inside of the border of your element so you can control how far the content is away from the border.

Margin is applied to the outside of the border of your element, so you can control how far the element is away from other elements.

Special usage: if you use a negative margin, you can pull the element closer to other elements. and also good to keep in mind: padding will increase the dimensions of your element, whereas margin won't.

Steven Parker
Steven Parker
231,236 Points

I might add that if your element does not have a visible border, the difference might be a bit hard to see, but it can affect how the element is displayed next to other elements. Margins can be collapsed, but not so with padding.

Kailash Seshadri
Kailash Seshadri
3,087 Points

so padding is between content and border but margin is outside the border? thanks

Sergey Podgornyy
Sergey Podgornyy
20,660 Points

The CSS padding properties are used to generate space around content. The CSS padding properties define the white space between the element content and the element border.

The CSS margin properties are used to generate space around elements. The margin properties set the size of the white space OUTSIDE the border.

https://accoldfusion.montgomerycollege.edu/new_faculty/ca272/wk10/boxmodel.png