Coding Demos on CODEPEN
Margins and Paddings
See the Pen Margin and Padding: Demo A by Oliver Roeger (@uic-des) on CodePen.
Margin is the space between block elements (orange boxes). Padding is the space between the text and the edge of the blue box (paragraph div/rule) or the space between the orange boxes and the blue boxes (since the padding is applied to the orange boxes here). You could also apply a margin to the blue boxes (p rule in CSS) to achieve the same result.