padding-***: ***;
Browser |
|
---|
The padding-*** property sets the top, bottom, left, and right paddings of an element.
(*** = top, bottom, left, and right)
div {
padding-top: 5px;
padding-right: 10px;
padding-bottom: 15px;
padding-left: 20px;
}
Property | Value | Explanation |
---|---|---|
padding-top | length, %, or auto | the top padding |
padding-right | length, %, or auto | the right padding |
padding-bottom | length, %, or auto | the bottom padding |
padding-left | length, %, or auto | the left padding |
Example
<html>
<head>
<title>TAG index</title>
<style type="text/css">
p {
width: 200px;
background-color: #85b9e9;
padding-top: 20px;
padding-bottom: 50px;
}
</style>
</head>
<body>
<p>The top padding:20px, The bottom padding:50px</p>
</body>
</html>
- Output
-
The top padding:20px, The bottom padding:50px