Margin

Margin: Margin is an outer space. It is used to create a space around an elements outside any element. You have all control on the margin with CSS. There are some property for setting the margin(Top, Right, Bottom, left).

1. One value like: (margin: 40px) – It means all four side margins will be 50px. All side like Top, Right, Bottom, left occupy 50px margin.

2. Two values like: (margin: 50px 10px) –First value 50px cover the top and bottom margin, second value 10x cover left and right margin.

3. Three values like (margin: 50px 10px 20px)-First value 50px cover the top margin, second value 10x cover left and right margin, Third value 20px cover bottom margin.

4. Four values like: (margin: 50px 10px 20px 30px) – First value 50px cover the top margin, second value 10x cover right margin, Third value 20px cover bottom margin, forth margin 30px cover left margins.

Property Values:

1. % –User can give the margin value in percentage also.
2. Length-Here define the margin in length units.
3. Auto- In which all four side margin will be equal. When user put the margin:auto then content will automatically come in the center of the container.
4. Margin:0 auto- It means margin from top and bottom will be 0px and margin from left and Right is auto means will be in the center.