CSS Padding

Padding defines the space between the element's border and its content. CSS padding is specified just like margins - they can be set individually for each side, or all sides at once.

Padding on all Sides
This example uses the padding property to set padding on all sides of an element.
<p style="border:2px solid red;padding:10px;">
This text has padding of 10 pixels on all four sides.
</p>


This results in:

This text has padding of 10 pixels on all four sides.

You can also declare all the padding of an element in a single property as follows:
padding: 10px 10px 10px 10px;
If you declare all 4 values as I have above, the order is as follows:

1. top
2. right
3. bottom
4. left

Example:
<p style="border:1px solid red;padding-left:30px;">This text has left padding of 30 pixels.</p>

This result in

This text has left padding of 30 pixels.