padding

Define the padding of an element with this general attribute. A padding is the space between an element's border and the content within it. We have added borders to the example so that you may see the effects of padding more readily.

Value Description
size px - size in terms of pixels
em - size in terms of the current font size
in - size in terms of inches
cm - size in terms of centimeters
percentage The width of this element will be a percentage of the element it is inside of.
four-sides There are four values that you can define. Each value will correspond to a specific side. The corresponding directions to values are: top, right, bottom, left.

Code:

p {padding: 15px; border: 1px solid black; }

h4 {padding: 5px 15px;
border: 1px solid black; }

h5{padding: 0px 5px 10px 3px;
border: 1px solid red;}

Display:

This is a paragraph that has a padding of 15 pixels on every side: top, right, bottom, and left.

This header 4 has a top and bottom padding of 5 pixels and a right and left padding of 15 pixels.

This header 5 has a top padding of 0 pixels, a right padding of 5 pixels, a bottom padding of 10 pixels, and a left padding of 3 pixels.

Compatibility Issues:

IE 5.0 - Padding can be buggy.
IE 5.5 - Padding can be buggy, but better than 5.0.