give space above and below a DIV

Question

I want to give a DIV space above and under its content. How can I do this using CSS? my DIV code is: ```

choisir un pseudo*:

```

Accepted Answer

You use the CSS `padding` property. In your case you might want to use `padding-top`and `padding-bottom` alone.

The syntax is the following:

```
padding: top right bottom left;
```

or

```
padding: vertical horizontal;
```

Some examples:

```
// This will set the top space to 1px, the right to 2px the bottom to 3px
// and the left to 4px
.input {
    padding: 1px 2px 3px 4px;
}

// This will set both the top and the bottom to 20px and the right and the
// left to 10px;
.input {
    padding: 20px 10px;
}

// This will set only the bottom space, leaving everything else
// to be automatically determined
.input {
    padding-bottom: 20px;
}
```

Solution