When to use "margin" vs "padding"?

Hello! Margin is the space outside of a page element. Padding defines the space surrounding content within a web element. 

Padding:

• Use padding within content areas such as articles, paragraphs, and divs to create breathing space around text and images. 
•  Apply padding to boxes, cards, or sections that contain related content or widgets. 
•  Padding around buttons and links improves their usability.

Margin: 

•  Use margin to create spacing between different elements such as blog posts.
•  Apply margin between the main content area and the sidebar to visually separate them. 
•  Use margin around images and their captions to provide visual separation.

Hope this helps!