CSS Margin

tutorial and example
tutorial and example

The CSS margin properties are used to generate space around the elements. It set the sixe of the white space outside the border.

There are various margin properties to set the side of an element. (top, right, bottom and left).

The following given example to understand how to implement margin with its properties.

  • margin-top
  • margin-right
  • margin-bottom
  • margin-left

All the margin properties have the following values.

Margin Properties Description
auto It is use to calculate the margin.
length It si used to specifies margin in px, pt, cm etc.
% It is used to specifies a margin in % of the width.
inherit It specifies the margin should be inherited from the parent element.

css Margins

NOTE: Negative values are allowed.

Let us see an example of CSS margin-top:

Try Now

Margin : Shorthand Property

It is used to shorten the code. It specifies all the margin properties in one property. The given following example will show to how to implement margin shorthand properties.

Let us see an example of CSS margin shorthand property:

Try Now