HTML CSS examples for CSS Property:padding-left
The padding-left CSS property sets the padding to the left side.
Padding is the amount of space between the left border and the content of an element.
The following table summarizes the padding-left Property.
Item | Value |
---|---|
Default value: | 0 |
Applies to: | All elements except <tbody>, <thead>, <tfoot>, <tr>, <colgroup> and <col>. It also applies to ::first-letter. |
Inherited: | No |
Animatable: | Yes. |
The syntax of the property is as follows:
padding-left: length | percentage | initial | inherit
The following table describes the values of this property.
Value | Description |
---|---|
length | Set the padding as a length value in px, pt, cm, em, etc. Negative length values are not allowed. |
percentage | Set the padding in percentage which is calculated with respect to the width of the element's containing block. Negative percentage values are not allowed. |
initial | Sets this property to its default value. |
inherit | take the value of its parent element padding-left property. |
The example below shows the padding-left property.
<!DOCTYPE html> <html lang="en"> <head> <title>Example of CSS padding-left property</title> <style type="text/css"> h1 {<!--from w ww . j av a 2s . co m--> padding-left: 2em; background: #ffb6c1; } p { padding-left: 50px; background: #f0e68c; } </style> </head> <body> <h1>This is a heading</h1> <p>This is a paragraph.</p> </body> </html>