1. home
  2. Tutorials
  3. Tutorial
Edit

Setting Padding for Each Side

You can set the padding property on each side using padding-top, padding-bottom, padding-right, padding-left attributes.

Example of Code

<!DOCTYPE html>
<html>
<head>
    <title>Example</title>
    <style>
      .Padding-on-each-Sides {
        background: gold;
        padding-top: 5px;
        padding-right: 60px;
        padding-bottom: 15px;
        padding-left: 30px;
      }
     .Paragraph-Padding-on-each-Sides {
        background: white;
      }
    </style>
</head>
<body>
    <div class="Padding-on-each-Sides">
      <p class="Paragraph-Padding-on-each-Sides">
        Different padding on each side.
      </p>
    </div>
</body>
</html>

Output

Example

Different padding on each side.