CSS padding-top

The CSS padding-top property is used to create top padding for specified element. For example:

HTML with CSS Code
<!DOCTYPE html>
<html>
<head>
   <style>
      .myd{border: 2px solid coral; padding-top: 32px;}
   </style>
</head>
<body>
   
   <div class="myd">
      This is an example of padding-top property in CSS.
   </div>
   
</body>
</html>
Output
This is an example of padding-top property in CSS.

Note - Top padding is the width (height) of area above the content and below the border, of specified element.

CSS padding-top Syntax

The syntax of padding-top property in CSS, is:

padding-top: x;

The value of x should be any of the following:

  • length - used to define custom sized top padding
  • initial - used to use the default value
  • inherit - used to use the value inherited by the parent element

Note - To learn about padding in detail, refer to its separate tutorial.

CSS Online Test


« Previous Tutorial Next Tutorial »



Like/Share Us on Facebook 😋