<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html lang=en>
<head>
<title>Padding</title>
<link rev=Made href="mailto:liam@htmlhelp.com">
<link rel=Start href="../index.html">
<link rel=Prev href="padding-left.html">
<link rel=Next href="border-top-width.html">
<link rel=Up href="../properties.html">
<link rel=Glossary href="http://www.htmlhelp.com/glossary/glossary.html">
<link rel=Copyright href="http://www.htmlhelp.com/copyright.html">
<link rel=StyleSheet href="../style.css" type="text/css">
<link rel=StyleSheet href="../aural.css" type="text/css" media=aural>
<meta name="author" content="John Pozadzides/Liam Quinn">
<meta name="description" content="A description of the padding property of Cascading Style Sheets, level 1.">
<meta name="keywords" content="html authoring, newsgroup, web design group, web page design, help, frequently asked questions, internet help, site creation, page creation, site design, page design, site layout, page layout, html, hypertext markup language, hyper text markup language, questions, graphics, validation, validators, www pages, html 3.2, wilbur, help files, tutorials, articles, reference material, guide, wdg, style, stylesheet, style sheet, css, cascading style sheets, padding property, answer">
</head>
<body bgcolor="#ffffff" text="#000000" link="#0000ff" vlink="#800080" alink="#000080">
<h2><img src="../wdglogo1.gif" width=250 height=83 alt="The Web Design Group"></h2>
<h1 align=center>Padding<img src="../css.gif" alt="" align=right width=99 height=73 hspace=5></h1>
<hr>
<table cellpadding=5>
<tr>
<th valign=top align=left><b>Syntax:</b> </th>
<td valign=top>padding: <value><br></td>
</tr>
<tr>
<th valign=top align=left><b>Possible Values:</b> </th>
<td valign=top>[ <a href="../units.html#length"><length></a> | <a href="../units.html#percentage"><percentage></a> ]{1,4}<br></td>
</tr>
<tr>
<th valign=top align=left><b>Initial Value:</b> </th>
<td valign=top>0<br></td>
</tr>
<tr>
<th valign=top align=left><b>Applies to:</b> </th>
<td valign=top>All elements<br></td>
</tr>
<tr>
<th valign=top align=left><b>Inherited:</b> </th>
<td valign=top>No<br></td>
</tr>
</table>
<p>The <strong class=css>padding</strong> property is a shorthand for the <strong class=css><a href="padding-top.html">padding-top</a></strong>, <strong class=css><a href="padding-right.html">padding-right</a></strong>, <strong class=css><a href="padding-bottom.html">padding-bottom</a></strong>, and <strong class=css><a href="padding-left.html">padding-left</a></strong> properties.</p>
<p>An element's <dfn>padding</dfn> is the amount of space between the <a href="border.html">border</a> and the content of the element. Between one and four values are given, where each value is either a <a href="../units.html#length">length</a> or a <a href="../units.html#percentage">percentage</a>. Percentage values refer to the parent element's width. Negative values are <em>not</em> permitted.</p>
<p>If four values are given, they apply to top, right, bottom, and left padding, respectively. If one value is given, it applies to all sides. If two or three values are given, the missing values are taken from the opposite side.</p>
<p>For example, the following rule sets the top padding to 2em, the right padding to 4em, the bottom padding to 5em, and the left padding to 4em:</p>
<pre><code class=css>BLOCKQUOTE { padding: 2em 4em 5em }</code></pre>
<hr width="60%" align=right>
<p align=right>Maintained by <a href="mailto:john@htmlhelp.com">John Pozadzides</a> and <a href="mailto:liam@htmlhelp.com">Liam Quinn</a></p>
<hr>
<p class=toolbar align=center><a href="http://www.htmlhelp.com/"><img src="../wdglogo-small.gif" width=105 height=40 alt="Web Design Group ~ "></a><a href="../index.html">CSS Index</a> ~ <a href="../structure.html">CSS Structure</a> ~ <a href="../properties.html">CSS Properties</a></p>
<p align=center><small><a href="http://www.htmlhelp.com/copyright.html">Copyright ©</a> 1997 John Pozadzides and Liam Quinn. All rights reserved.</small></p>
</body>
</html>
