In CSS, the margin property is used to create space around elements, outside of any specific borders.
```
element {
margin-top: 10px; /* Top margin */
margin-right: 20px; /* Right margin */
margin-bottom: 30px; /* Bottom margin */
margin-left: 40px; /* Left margin */
}
```
The margin property can have from one to four values.
Here are some examples:
- Four values: The values apply to the top, right, bottom, and left in that order (clockwise).
```
element {
margin: 25px 50px 75px 100px;
}
```
- Three values: The first value applies to the top, the second value applies to the right and left, the third value applies to the bottom.
```
element {
margin: 25px 50px 75px;
}
```
- Two values: The first value applies to the top and bottom, the second value applies to the right and left.
```
element {
margin: 25px 50px;
}
```
- One value: Applies to all sides.
```
element {
margin: 25px;
}
```
Also, you can use the shorthand version to define all four margins at once.
```
element {
margin: 10px 20px 30px 40px;
}
```
This sets the margin to: 10px top, 20px right, 30px bottom and 40px left.
To remove margins you can set the value to 0:
```
element {
margin: 0;
}
```
You can also set negative values for margins:
```css
element {
margin: -10px;
}
```
This could cause the element to overlap with others.
