CSS margin property

CSS margin

CSS margin is a shorthand property, used to specify elements margin area.

It is similar to CSS padding, but the difference is when padding is used , extra space is added within the element. But in margin extra space is added around the element.

css margin consists of following shorthand properties

  • margin-top : It is used to specify the margin area on the elements top.
  • margin-right : It is used to specify the margin area on the elements right.
  • margin-bottom : It is used to specify the margin area on the elements bottom.
  • margin-left : It is used to specify the margin area on the elements left.
Syntax

margin : margin-top margin-right margin-bottom margin-left;

Example

Try Yourself

In the above example values used in margin property are,

100px - margin-top

25px - margin-right

10px - margin-bottom

30px - margin-left

Click here to Image Explanation