CSS padding-right Property

The padding-right property in CSS is used to set the amount of padding added to the right of an element. It has the following syntax:

padding-right: [value];

where [value] can be specified either in length or in percentages. When specified in percentages, it is the percentage of the width of the element. The default value for padding-right is 0, and [value] can never be a negative number.

Example 1

#container1 {   padding-right:100px;   border: 1px solid 000000; }

The following HTML

<div id="container1"> Example of CSS padding-right property using length </div>

renders the following:

Example of CSS padding-right property using length

Notice the right padding the text and the right of the light green area is 100px. The top, bottom, and left paddings are all 0.

Example 2

#container2 {   padding-right:15%;   border: 1px solid 000000; }

The following HTML

<div id="container2"> Example of CSS padding-right property using percentages </div>

renders the following:

Example of CSS padding-right property using percentages

Notice the right padding the text and the right of the light green area is 15% of the width. The top, bottom, and left paddings are all 0.

List of padding properties

Property	Usage
padding	Specifies the amount of padding on all four sides of an element
padding-bottom	Specifies the bottom padding of an element
padding-left	Specifies the left padding of an element
padding-right	Specifies the right padding of an element
padding-top	Specifies the top padding of an element