CSS margin attribute

Definition and usage

The margin shorthand property sets all margin properties in a single declaration. This property can have 1 to 4 values.

Description

This shorthand property sets the width of all margins of an element, or sets the width of the margins on each side.

The vertical margins of adjacent block-level elements will collapse, and inline elements do not actually occupy the top and bottom margins. The left and right margins of inline elements do not collapse. Similarly, the margins of floating elements will not collapse. Negative margin values can be specified, but caution should be used when using them.

Note:Negative values can be used.

Example 1

margin:10px 5px 15px 20px;
  • The top margin is 10px
  • The right margin is 5px
  • The bottom margin is 15px
  • The left margin is 20px

Example 2

margin:10px 5px 15px;
  • The top margin is 10px
  • The right and left margins are 5px
  • The bottom margin is 15px

Example 3

margin:10px 5px;
  • The top and bottom margins are 10px
  • The right and left margins are 5px

Example 4

margin:10px;
  • All 4 margins are 10px

See also:

CSS tutorial:CSS Margin

HTML DOM reference manual:margin property

Example

Set the 4 margins of the p element:

p
  {
  margin:2cm 4cm 3cm 4cm;
  }

Try it yourself

CSS syntax

margin: length|auto|initial|inherit;

Property value

Value Description
auto Browser calculates the margin.
length Specifies the margin value in a specific unit, such as pixels, centimeters, etc. The default value is 0px.
% Margins are specified as a percentage of the width of the containing element.
inherit Specifies that margins should be inherited from the parent element.

Technical details

Default value: 0
Inheritance: no
Version: CSS1
JavaScript syntax: object.style.margin="10px 5px"

More examples

All margin properties in a single declaration
This example demonstrates how to set all margin properties in a single declaration.

Browser support

The numbers in the table indicate the first browser version that fully supports this attribute.

Chrome IE / Edge Firefox Safari Opera
1.0 6.0 1.0 1.0 3.5