CSS padding-right Property
Padding is the space between its content and its border. The padding-right property in CSS is used to set the width of the padding area on the right of an element.
Syntax:
padding-right: length | percentage | initial | inherit;
Property values:
- length: This mode is used to specify the size of padding as a fixed value. The default value is 0. It must be non-negative.
Syntax:
padding-right: length;
Example:
html
<!DOCTYPE html><html> <head> <title> padding-right Property </title> <style> .geek { padding-right: 200px; color: white; background: green; width:50%; font-size:18px; } </style> </head> <body style = "text-align:center"> <h1 style = "color: green;"> GeeksforGeeks </h1> <h2> padding-right Property </h2> <!-- padding-right property used here --> <p class = "geek"> This paragraph has a padding-right: 200px; </p> </body></html> |
Output:
- percentage: This mode is used to set the right padding in percent of the width of the element. It must be non-negative.
Syntax:
padding-right: percentage;
Example:
html
<!DOCTYPE html><html> <head> <title> padding-right Property </title> <style> .geek { padding-right: 40%; color: white; background: green; width:50%; font-size:18px; } </style> </head> <body style = "text-align:center"> <h1 style = "color: green;"> GeeksforGeeks </h1> <h2> padding-right Property </h2> <!-- padding-right property used here --> <p class = "geek"> This paragraph has a padding-right: 40%; </p> </body></html> |
Output:
- initial: This property is used to set the default value.
Syntax:
padding-right: initial;
Example:
html
<!DOCTYPE html><html> <head> <title> padding-right Property </title> <style> .geek { padding-right: initial; color: white; background: green; width:70%; font-size:25px; } </style> </head> <body style = "text-align:center"> <h1 style = "color: green;"> GeeksforGeeks </h1> <h2> padding-right Property </h2> <!-- padding-right property used here --> <p class = "geek"> This paragraph has a padding-right: initial; </p> </body></html> |
Output:
Supported Browsers: The browser supported by padding-right property are listed below:
- Google Chrome 1.0 and above
- Edge 12.0 and above
- Internet Explorer 4.0 and above
- Firefox 1.0 and above
- Opera 3.5 and above
- Apple Safari 1.0 and above
Please Login to comment...