HTML and CSS Reference
In-Depth Information
8.4.7.12. The padding properties
Like the margin properties, the various padding properties let you con-
trol the padding space around an element, between the element's con-
tent area and its border (see
Figure 8-14
, earlier in the chapter).
Padding always is rendered using the background color or image of the
element. As a result, you can specify only the size of the padding; it has
no color or rendered style.
The
padding-left, padding-right, padding-top
, and
padding-bottom
prop-
erties all accept a length or percentage value indicating the amount of
space the styles-conscious browser should reserve around the element.
Percentage values are computed as a percentage of the containing ele-
ment's width. Padding can never be negative. The default padding is 0.
These are valid padding settings:
p {padding-left: 0.5cm}
img {padding-left: 10%}
The first example creates 0.5 centimeters of padding between the con-
tents of the
<p>
tag and its left border. The second example creates pad-
ding to the left of the
<img>
tag equal to 10 percent of the parent ele-
ment's width.
Like the shorthand
margin
and
border
properties, you can use the short-
hand
padding
property to define all four padding amounts, using from
one to four values to affect the padding sides as described in
Table 8-1
.
Internet Explorer does not support the
padding
property, but all the oth-
er popular browsers do.
