CSS padding


CSS padding property is used to leave space between HTML element and its content.
    Padding are of following type:
  • Padding top
  • Padding bottom
  • Padding left
  • Padding right

Example showing effects of padding

<!DOCTYPE html>
<html>
<head>
<style>
p{
border:1px solid red;
padding-top:50px;
padding-right:30px;
padding-left:50px;
padding-bottom:80px;
}
</style>
<title>
CSS PADDING
</title>
</head>
<body>
<p>Kolkata is capital of West Bengal.</p>
</body>
</html>

Output:

Here entire <p> element is selected in red colour to make you understand area occupied by <p> element afer adding padding.

Kolkata is capital of West Bengal.