CSS Padding Property

Padding:It is an inner space between border and content. Padding create an extra space within an element, While margin create a space around an element.

1. One value like: (Padding: 40px) – It means all four side Padding will be 50px. All side like Top, Right, Bottom, left occupy 50px Padding.
2. Two values like: (Padding: 50px 10px) –First value 50px cover the top and bottom Padding, second value 10x cover left and right Padding.
3. Three values like (Padding: 50px 10px 20px)-First value 50px cover the top Padding, second value 10x cover left and right Padding, Third value 20px cover bottom Padding.
4. Four values like: (Padding: 50px 10px 20px 30px) – First value 50px cover the top Padding, second value 10x cover right Padding, Third value 20px cover bottom Padding, forth value 30px cover left Padding.

Property Values:

1. Length-Define the Padding in length units. Specify the padding in px, pt, cm etc.
2. %- It Specify the padding in percent of the width of the containing element.

Example 1

Example 2