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
|
