The margin property sets the margins around an element.
div {
margin: 5px 10px 15px 20px;
}
| Property | Value | Explanation |
|---|---|---|
| margin | length, %, or auto | the top, bottom, left, and right margins |
margin: 2px; : [all sides] margins
margin: 2px 4px; : [top, bottom] [left, right] margins
margin: 2px 4px 6px; : [top] [left, right] [bottom] margins
margin: 2px 4px 6px 8px; : [top] [right] [bottom] [left] margins

<html> <head> <title>TAG index</title> <style type="text/css"> p { background-color: #85b9e9; } #example1 { margin: 50px; } #example2 { margin: 50px 100px; } #example3 { margin: 50px 10px 50px 200px; } </style> </head> <body> <p id="example1">[the margin on all sides:50px]</p> <p id="example2">[top,bottom:50px] [left,right:100px]</p> <p id="example3">[top,bottom:50px] [left:200px] [right:10px]</p> </body> </html>
[the margin on all sides:50px]
[top,bottom:50px] [left,right:100px]
[top,bottom:50px] [left:200px] [right:10px]