The CSS margin properties define the space around elements.
The margin clears an area around an element (outside the border). The margin does not have a background color, and is completely transparent.
The top, right, bottom, and left margin can be changed independently using separate properties.
margin property can also be used, to change all margins at once.
|auto||The browser calculates a margin|
|length||Specifies a margin in px, pt, cm, etc. Default value is 0px|
|%||Specifies a margin in percent of the width of the containing element|
|inherit||Specifies that the margin should be inherited from the parent element|
|Note: It is also possible to use negative values, to overlap content.|
In CSS, it is possible to specify different margins for different sides of an element:
To shorten the code, it is possible to specify all the margin properties in one property. This is called a shorthand property.
The shorthand property for all the margin properties is "
margin property can have from one to four values.
Set the top margin of a text using a cm value
This example demonstrates how to set the top margin of a text using a cm value.
Set the bottom margin of a text using a percent value
This example demonstrates how to set the bottom margin in percent, relative to the width of the containing element.
|margin||A shorthand property for setting the margin properties in one declaration|
|margin-bottom||Sets the bottom margin of an element|
|margin-left||Sets the left margin of an element|
|margin-right||Sets the right margin of an element|
|margin-top||Sets the top margin of an element|