CSS margin properties
With CSS margin properties, you can specify how much space there should be around elements.
This tutorial focuses on:
- Setting the left margin of an element
- Setting the right margin of an element
- Setting the top margin of an element
- Setting the bottom margin of an element
Setting the left margin of an element
The left margin of an element is set using the margin-left property.
Example:
<html>
<head>
<title>Setting the left margin of an element</title>
</head>
<body>
<p>This paragraph has no specified margin.</p>
<p style="margin-left: 20px;">This paragraph has a left margin of 20 pixels.</p>
</body>
</html>
Output:
This paragraph has no specified margin.
This paragraph has a left margin of 20 pixels.
Setting the right margin of an element
The right margin of an element is set using the margin-right property.
Example:
<html>
<head>
<title>Setting the right margin of an element</title>
</head>
<body>
<p>This paragraph has no specified margin.</p>
<p style="margin-right 25px;">This paragraph has a right margin of 25 pixels.</p>
</body>
</html>
Output:
This paragraph has no specified margin.
This paragraph has a right margin of 25 pixels.
Setting the top margin of an element
The top margin of an element is set using the margin-top property.
Example:
<html>
<head>
<title>Setting the top margin of an element</title>
</head>
<body>
<p>This paragraph has no specified margin.</p>
<p style="margin-top: 45px;">This paragraph has a top margin of 45 pixels</p>
</body>
</html>
Output:
This paragraph has no specified margin.
This paragraph has a top margin of 45 pixels.
Setting the bottom margin of an element
The bottom margin of an element is set using the margin-bottom property.
Example:
<html>
<head>
<title>Setting the bottom margin of an element</title>
</head>
<body>
<p>This paragraph has no specified margin.</p>
<p style="margin-bottom: 35px;">This paragraph has a bottom margin of 35 pixels.</p>
</body>
</html>
Output:
This paragraph has no specified margin.
This paragraph has a bottom margin of 35 pixels.