CSS Margin
The CSS margin properties define the space around elements.
Examples
All the margin properties in one declaration
This example demonstrates how to set a shorthand property for setting all of the margin properties
in one declaration.
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 top margin of a text using a percent value
This example demonstrates how to set the top margin of a text using a percent
value.
Set the
bottom margin of a text using a cm value
This example demonstrates how to set the bottom 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 of a text using a percent
value.
Set the left
margin of a text using a cm value
This example demonstrates how to set the left margin of a text using a cm value.
Set
the left margin of a text using a percent value
This example demonstrates how to set the left margin of a text using a percent
value.
Set the
right margin of a text using a cm value
This example demonstrates how to set the right margin of a text using a cm value.
Set
the right margin of a text using a percent value
This example demonstrates how to set the right margin of a text using a percent
value.
CSS Margin Properties
The CSS margin properties define the space around elements. It is possible to use
negative values to overlap content. The top, right, bottom, and left margin can
be changed independently using separate properties. A shorthand margin property
can also be used to change all of the margins at once.
Note: Netscape and IE give the body tag a default margin of
8px. Opera does not! Instead, Opera applies a default padding of 8px, so if one
wants to adjust the margin for an entire page and have it display correctly in
Opera, the body padding must be set as well!
Browser support: IE: Internet Explorer, F: Firefox, N: Netscape.
W3C: The number in the "W3C" column indicates in which CSS recommendation
the property is defined (CSS1 or CSS2).
Property |
Description |
Values |
IE |
F |
N |
W3C |
margin
|
A shorthand property for setting the margin properties in
one declaration |
margin-top
margin-right
margin-bottom
margin-left |
4 |
1 |
4 |
1 |
margin-bottom
|
Sets the bottom margin of an element |
auto
length
% |
4 |
1 |
4 |
1 |
margin-left
|
Sets the left margin of an element |
auto
length
% |
3 |
1 |
4 |
1 |
margin-right
|
Sets the right margin of an element |
auto
length
% |
3 |
1 |
4 |
1 |
margin-top
|
Sets the top margin of an element |
auto
length
% |
3 |
1 |
4 |
1 |
|
|
Get Your Diploma!
W3Schools' Online Certification Program is the perfect solution for busy
professionals who need to balance work, family, and career building.
The HTML Certificate is for developers who want to document their knowledge of HTML, XHTML, and CSS.
The JavaScript Certificate is for developers who want to document their knowledge of JavaScript and the HTML DOM.
The XML Certificate is for developers who want to document their knowledge of XML, XML DOM and XSLT.
The ASP Certificate is for developers who want to document their knowledge of ASP, SQL, and ADO.
The PHP Certificate is for developers who want to document their knowledge of PHP and SQL (MySQL).
|
|