CSS Padding Property

From http://www.w3schools.com (Copyright Refsnes Data)

# CSS padding Property

Complete CSS Reference

## Definition

The padding property is a shorthand property for setting all of the padding properties in one declaration.

Note: Negative values are not allowed.

Inherited: No

## JavaScript Syntax

CSS properties can also be dynamically changed with a JavaScript.

Scripting Syntax: object.style.padding="2cm"

In our HTML DOM tutorial you can find more details about the padding property.

In our HTML DOM tutorial you can also find a full Style Object Reference.

## Example

h1 {padding: 10px}
the padding will be 10px on all four sides

h1 {padding: 10px 2%}
top and bottom padding will be 10px, left and right padding will be 2% of the width of the closest element.

h1 {padding: 10px 2% 15px}
top padding will be 10px, left and right padding will be 2% of the width of the closest element, bottom padding will be 15px

h1 {padding: 10px 2% 15px 20px}
top padding will be 10px, right padding will be 2% of the width of the closest element, bottom padding will be 15px, left padding will be 20px

## Possible Values

Value | Description
--- | ---
padding-top padding-right padding-bottom padding-left | Sets the padding. The values comes in % (defines padding in % of the width of the closest element) and length (defines a fixed padding). Default value: Not defined

## Try-It-Yourself Demos

All the padding properties in one declaration
This example demonstrates a shorthand property for setting all of the padding properties in one declaration, can have from one to four values.

Complete CSS Reference

From http://www.w3schools.com (Copyright Refsnes Data)