Margin & Padding

[joserodrigz]

Sorry my ignorance: what’s the difference between MARGIN and PADDING ?
Which one should use when I want to put space on top and in the bottom of the section ???

Thanks in advance !

[jade]

Hi Jose,

Padding is the space between the content and the border, whereas margin is the space outside the border.

Here is an image that illustrates this idea.

So basically, margin is applied to the outside of your element hence effecting how far your element is away from other elements while padding is applied to the inside of your element hence effecting how far your element’s content is away from the border.

You may watch this video for more info:

So as for your question, you could either use padding or margin to add a bottom and top spacing to your section, just note the different on what was previously mentioned. You could see the main difference if you set a background color to the section. If you add a top and bottom padding, the space will be added inside the section, which will include the background color. If you use margin, you would see some space but a white space on the top and bottom of the section.

Hope this explains it.

[joserodrigz]

Great !
Thanks

[nabeel]

You’re most welcome!