Property Description
The margin shorthand property sets all of the margin properties in one declaration. This property can accept from one to four values.
margin: <top> <right> <bottom> <left>|initial|inherit
If all four values are provided, the margins are as specified.
margin: <top> <right/left> <bottom>|initial|inherit
If three values are provided, right and left margin are set as middle value.
margin: <top/bottom> <right/left>|initial|inherit
If two values are provided, top and bottom margin are set as the first value, right and left margin are set as second value.
margin: <top/right/bottom/left>
If one value is provided, all four margin values are set the same.
Property Values
| Value | Description |
|---|---|
| auto | The browser calculates a margin |
| length | (default is 0) Specifies a margin in px, pt, cm, etc. Value can be negative |
| % | Specifies a margin in percent of the width of the containing element. Value can be negative |
| initial | Specifies that the value of the property should be set to the default value |
| inherit | Specifies that the value of the property should be inherited from the parent element |
Examples
This example sets the padding for paragraph elements.
p {
margin:2cm 4cm 3cm 4cm;
}Browser Support
| Chrome | Firefox | IE | Safari | Opera |
|---|---|---|---|---|
| 1.0 | 1.0 | 6.0 | 1.0 | 3.5 |
Miscellaneous Information
| Inherited: | No |
|---|---|
| Defined In: | CSS1 |
| Default Value: | 0 |
Property Description
The margin-bottom property sets the bottom margin of an element.
This property has the following syntax:
margin-bottom: auto|length|%|initial|inherit;
Note: Negative values are allowed.
Property Values
| Value | Description |
|---|---|
| auto | Browser calculates the margin |
| length | (default is 0) Specifies a bottom margin in px, pt, cm, etc. Value can be negative |
| % | Specifies a bottom margin in percent of the width of the containing element |
| initial | Specifies that the value of the property should be set to the default value |
| inherit | Specifies that the value of the property should be inherited from the parent element |
Examples
This example sets the bottom margin for paragraph elements.
p {
margin-bottom:2cm;
}Browser Support
| Chrome | Firefox | IE | Safari | Opera |
|---|---|---|---|---|
| 1.0 | 1.0 | 6.0 | 1.0 | 3.5 |
Miscellaneous Information
| Inherited: | No |
|---|---|
| Defined In: | CSS1 |
| Default Value: | 0 |
Property Description
The margin-left property sets the left margin of an element.
This property has the following syntax:
margin-left: auto|length|%|initial|inherit;
Note: Negative values are allowed.
Property Values
| Value | Description |
|---|---|
| auto | Browser calculates the margin |
| length | (default is 0) Specifies a left margin in px, pt, cm, etc. Value can be negative |
| % | Specifies a left margin in percent of the width of the containing element |
| initial | Specifies that the value of the property should be set to the default value |
| inherit | Specifies that the value of the property should be inherited from the parent element |
Examples
This example sets the left margin for paragraph elements.
p {
margin-left:2cm;
}Browser Support
| Chrome | Firefox | IE | Safari | Opera |
|---|---|---|---|---|
| 1.0 | 1.0 | 6.0 | 1.0 | 3.5 |
Miscellaneous Information
| Inherited: | No |
|---|---|
| Defined In: | CSS1 |
| Default Value: | 0 |
Property Description
The margin-right property sets the right margin of an element.
This property has the following syntax:
margin-right: auto|length|%|initial|inherit;
Note: Negative values are allowed.
Property Values
| Value | Description |
|---|---|
| auto | Browser calculates the margin |
| length | (default is 0) Specifies a right margin in px, pt, cm, etc. Value can be negative |
| % | Specifies a right margin in percent of the width of the containing element |
| initial | Specifies that the value of the property should be set to the default value |
| inherit | Specifies that the value of the property should be inherited from the parent element |
Examples
This example sets the right margin for paragraph elements.
p {
margin-right:2cm;
}Browser Support
| Chrome | Firefox | IE | Safari | Opera |
|---|---|---|---|---|
| 1.0 | 1.0 | 6.0 | 1.0 | 3.5 |
Miscellaneous Information
| Inherited: | No |
|---|---|
| Defined In: | CSS1 |
| Default Value: | 0 |
Property Description
The margin-top property sets the top margin of an element.
This property has the following syntax:
margin-top: auto|length|%|initial|inherit;
Note: Negative values are allowed.
Property Values
| Value | Description |
|---|---|
| auto | Browser calculates the margin |
| length | (default is 0) Specifies a top margin in px, pt, cm, etc. Value can be negative |
| % | Specifies a top margin in percent of the width of the containing element |
| initial | Specifies that the value of the property should be set to the default value |
| inherit | Specifies that the value of the property should be inherited from the parent element |
Examples
This example sets the top margin for paragraph elements.
p {
margin-top:2cm;
}Browser Support
| Chrome | Firefox | IE | Safari | Opera |
|---|---|---|---|---|
| 1.0 | 1.0 | 6.0 | 1.0 | 3.5 |
Miscellaneous Information
| Inherited: | No |
|---|---|
| Defined In: | CSS1 |
| Default Value: | 0 |
