| Type: | length, percentage (calculated with respect to the width of the containing box) |
|---|---|
| Inherited: | no |
| Used By: | All block elements |
| See: | border margin |
The padding attribute controls the space between the contents of an element and its border. It can be used by any block element. The space between an elements border and it's neighbours is controlled by the margin attribute.
The padding for each side of the element can be set separately by using the padding-left, padding-right, padding-top or padding-bottom attributes, or the overall padding can be set by using the padding attribute.
If there is only one value, it applies to all sides. If there are two values, the top and bottom paddings are set to the first value and the right and left paddings are set to the second. If there are three values, the top is set to the first value, the left and right are set to the second, and the bottom is set to the third. If there are four values, they apply to the top, right, bottom, and left, respectively.
The padding around the content will be filled with the elements background (if set).
These examples set the top and bottom padding to 10pt and the left and right to 0pt.
P { padding-top: 10pt; padding-bottom:10pt; padding-left:0pt; padding-right:0pt; }
P { padding: 10pt 0pt; }