Are padding and margin interchangeable?


#1

Question

Can I use padding instead of margin to position an element?

Answer

Not always, even though they might seem to render similar results separating elements from one another, their main difference is that margin will create the space outside of the element, while padding constricts space inwards.

Here’s a visual example where the first element (red border) has received a padding property of 50px and the second (blue border) a margin property of 50px.


The space they occupy is the same, but the way it is occupied is different and that might make a difference in how your element is displayed.