CSS Padding
The CSS padding properties define the space between the element border and the element content.
Examples
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.
Set the top padding using a cm value
This example demonstrates how to set the top padding of a table cell using a cm value.
Set the top padding using a percent value
This example demonstrates how to set the top padding of a table cell using a percent value.
Set the bottom padding using a cm value
This example demonstrates how to set the bottom padding of a table cell using a cm value.
Set the bottom padding using a percent value
This example demonstrates how to set the bottom padding of a table cell using a percent value.
Set the
left padding using a cm value
This example demonstrates how to set the left padding of a table cell using a cm value.
Set the left padding using a percent value
This example demonstrates how to set the left padding of a table cell using a percent value.
Set the right padding using a cm value
This example demonstrates how to set the right padding of a table cell using a cm value.
Set the right padding using a percent value
This example demonstrates how to set the right padding of a table cell using a percent value.
CSS Padding Properties
The CSS padding properties define the space between the element border and the element
content. Negative values are not allowed. The top, right, bottom, and left padding can
be changed independently using separate properties. A shorthand padding property
is also created to control multiple sides at once.
Browser support: IE: Internet Explorer, F: Firefox, N: Netscape.
W3C: The number in the "W3C" column indicates in which CSS recommendation
the property is defined (CSS1 or CSS2).
| Property |
Description |
Values |
IE |
F |
N |
W3C |
| padding |
A shorthand property for setting all of the padding properties in
one declaration |
padding-top
padding-right
padding-bottom
padding-left |
4 |
1 |
4 |
1 |
|
padding-bottom
|
Sets the bottom padding of an element |
length
% |
4 |
1 |
4 |
1 |
|
padding-left
|
Sets the left padding of an element |
length
% |
4 |
1 |
4 |
1 |
|
padding-right
|
Sets the right padding of an element |
length
% |
4 |
1 |
4 |
1 |
| padding-top |
Sets the top padding of an element |
length
% |
4 |
1 |
4 |
1 |
 |
|
Get Your Diploma!
W3Schools' Online Certification Program is the perfect solution for busy
professionals who need to balance work, family, and career building.
The HTML Certificate is for developers who want to document their knowledge of HTML, XHTML, and CSS.
The JavaScript Certificate is for developers who want to document their knowledge of JavaScript and the HTML DOM.
The XML Certificate is for developers who want to document their knowledge of XML, XML DOM and XSLT.
The ASP Certificate is for developers who want to document their knowledge of ASP, SQL, and ADO.
|
|