CSS Margin (Margin)

clear the area around the border, separating it from other boxes.

CSS Margin Properties

CSS margin properties allow you to set the margins on both sides of an element's box. Margins do notbackground-colorIt is completely transparent.

Set margins for each side

You can easily specify different margins for different sides of an element (such as top, right, bottom, or left) using the individual margin properties of CSS.

h1　{margin-bottom:　20px;}
p　{margin-left:　10px;margin-right:　30px;}

Shorthand Margin Properties

The margin property is a shorthand property to avoid setting each margin separately: margin-top, margin-right, margin-bottom and margin-left.

h1　{　margin:　0　10px;}
p　{margin:　25px　50px　75px　100px;}

This shorthand notation can take one, two, three, or four space-separated values.

• If setOne valueapply it to all four sides.

• If specifiedTwo valuesapply the first value to the top and bottom, and the second value to the right and left.

• If specifiedThree valuesapply the first value to the top, the second value to the left and right, and the last value to the bottom.

• If specifiedFour valuesIf specified, apply them in the specified order to the top, right, bottom, and left.