Padding-Right

This example demonstrates how to set the right padding of a <p> element.

HTML file: Displayed by browser:
<style>
p.padding {
   padding-right: 2cm;
}
p.padding2 {
   padding-right: 50%;
}
</style>
<body>
<p>This is a paragraph with no right padding. This is a paragraph with no right padding. This is a paragraph with no right padding.</p>
<p class="padding">This paragraph has a right padding of 2 cm. This paragraph has a right padding of 2 cm. This paragraph has a right padding of 2 cm.</p>
<p class="padding2">This paragraph has a right padding of 50%. This paragraph has a right padding of 50%. This paragraph has a right padding of 50%.</p>
</body>

This is a paragraph with no right padding. This is a paragraph with no right padding. This is a paragraph with no right padding.

This paragraph has a right padding of 2 cm. This paragraph has a right padding of 2 cm. This paragraph has a right padding of 2 cm.

This paragraph has a right padding of 50%. This paragraph has a right padding of 50%. This paragraph has a right padding of 50%.


Back button Table of Contents Next button