Search within TutorialsPark

CSS margin Property


A shorthand to set the margin of the element


Definition and Notes.

1. The CSS margin property is a shorthand to set the margin of the element in a single declaration

2. It specifies the empty space in-between the elements borders and the surrounding elements.


a. margin: 10px 15px 20px 25px (i.e clockwise starting from top)

10px : top

15px : right

20px : bottom

25px : left


b. margin: 10px 15px 20px (i.e clockwise starting from top)

10px : top

15px : right and left

20px : bottom


c. margin: 10px 15px (i.e clockwise starting from top)

10px : top and bottom

15px : right and left


d. margin: 10px

10px : all edges of the element


Syntax:

CSS margin property. internetexplorer safari firefox opera chrome

View in Splitscreen»

Code-Editor:

Note-If margin is specified in percent(px), the value is based on the values of the parent element.

Property Values

Value Description
length To specify the length using length units (px, pt, em , cm etc)
% To specify the length using percentages values
auto Leaves it to the browser to set the margin
inherit The value for margin is inherited from the parent element

Specifications

Specs Value
Name margin
Value [<length> | <percentage> | auto] {1,4} | inherit
Initial Value See Individual Properties
Applies to all elements except elements with table display types other than table-caption, table and inline-table.
Javascript syntax object.style.margin="10px"
Inherited No
Percentages relative to the containing box
Computed Value See Individual Properties
Browser Support internetexplorer safari firefox opera chrome

Related Examples.