What is padding in CSS? And margin? What's the difference?
I know that the subject is very basic, but recently I noticed that people tend to confuse them, use them together (which is ok) or switch from one to the other without knowing why. Sometimes using them - especially with transparent elements - we might not notice the difference between the two properties.
The definitions
Let's start from the beginning.Margin: it defines the distance between the element and other elements. It's like a surrounding space and determines what's the measure of that space. The margin is outside the object and it is always transparent.
Padding: it defines the distance from the border of the element and its content. The padding is inside the object and it takes its background color.