<html>
<link rel="stylesheet" href="josh.css">
<body bgcolor="#FFFFFF">
<div id="Description">
			<table cellpadding="0" cellspacing="0" border="0" width="100%" class="main">
				<tr><td valign="top" class="name">padding</td><td valign="top" nowrap class="compatibility">NN <span class="emphasis">4</span> IE <span class="emphasis">4</span> CSS <span class="emphasis">1</span></td>
				</tr>
				<tr>
					<td colspan="2" class="divider"><img src="dwres:18084" width="100%" height="1"></td>
				</tr>
				<tr>
					<td valign="top" nowrap class="usage"><p class="literal"></p>
					</td><td valign="top" nowrap class="requirements">Inherited: No</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="description"><p>This is a shortcut attribute that can set the padding widths of up to
four edges of an element with one statement. Padding is space that
extends around the content box of an element up to but not including
any border that may be specified for the element. Padding picks up
the background image or color of its element. As you add padding to
an element, you increase the size of the visible rectangle of the
element without affecting the content block size. You may supply one
to four space-delimited padding values. The number of values
determines which sides receive the assigned padding.
</p>
					</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&nbsp;</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="csssyntax"><span class="title">CSS Syntax</span></td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&nbsp;</td>
				</tr>
				<tr>
					<td><span class="programlisting"><pre>padding: <span class="replaceable">paddingThickness</span> {1,4}</pre>
						</span></td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&nbsp;</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="value"><span class="title">Value</span></td>
				</tr>
				<tr>
					<td><p>This attribute accepts one, two, three, or four values, depending on
how many and which sides you want to assign padding to. Values for
<span class="replaceable">paddingThickness</span> can be
<span class="replaceable">lengths</span> or percentages of the next
outermost element size. Value quantities and positions are
interpreted as follows.
</p>
						<table border="1"><tbody><tr><th>Number of values</th><th>Effect</th></tr>
								<tr><td>1</td><td>All four padding edges set to value</td>
								</tr>
								<tr><td>2</td><td>Top and bottom padding set to the first value, right and left padding
set to the second value
</td>
								</tr>
								<tr><td>3</td><td>Top padding set to first value, right and left padding set to second
value, bottom padding set to third value
</td>
								</tr>
								<tr><td>4</td><td>Top, right, bottom, and left padding set, respectively</td>
								</tr>
							</tbody></table>
					</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&nbsp;</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="initvalue"><span class="title">Initial Value</span></td>
				</tr>
				<tr>
					<td><p><span class="literal">0</span>; IE for Windows specifies a default value of
<span class="literal">1</span> for <span class="literal">td</span> and
<span class="literal">th</span> elements.
</p>
					</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&nbsp;</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="example"><span class="title">Example</span></td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&nbsp;</td>
				</tr>
				<tr>
					<td><span class="programlisting"><pre>p.highlight {padding: 10px 20px}</pre>
						</span></td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&nbsp;</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="appliesto"><span class="title">Applies To</span></td>
				</tr>
				<tr>
					<td><p>All elements (IE 5 for Macintosh, IE 5.5 for Windows, and Netscape
6); <span class="literal">body</span>, <span class="literal">caption</span>,
<span class="literal">div</span>, <span class="literal">iframe</span>,
<span class="literal">marquee</span>, <span class="literal">table</span>,
<span class="literal">td</span>, <span class="literal">textarea</span>,
<span class="literal">tr</span>, and elements (IE 5 and earlier for Windows).
</p>
					</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&nbsp;</td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="objectmodelreference"><span class="title">Object Model Reference</span></td>
				</tr>
				<tr>
					<td valign="top" colspan="2" class="CLEARSEPARATION">&nbsp;</td>
				</tr>
				<tr>
					<td><span class="programlisting"><pre>[window.]document.getElementById("<span class="replaceable">elementID</span>").style.padding</pre>
						</span></td>
				</tr>
			</table>
		</div>
</body>
</html>