Margins

The space between the border of an element and the border of another element is called margin. You can think of it as the space between the border of an image and the border of the adjacent image.

Similar to padding, we can create margins on each side as follows:

Left margin:

margin-left: 10px;

Right margin:

margin-right: 10px;

Top margin:

margin-top: 10px;

Bottom margin:

margin-bottom: 10px;

You can mix these with different sizes on different sides, and if you need to create margins of the same size on all sides, you can use the shorthand version:

margin: 10px;

This declaration sets the margin size on all sides to 10 pixels.