---
title: "What is Padding in CSS (Cascading style Sheet) and how to use it ?"  
description: "What is Padding in CSS (Cascading style Sheet) and how to use it ?"  
author: "Abhishek Srivasatava"  
published: 2016-10-13  
updated: 2020-09-14  
canonical: https://www.mindstick.com/interview/23083/what-is-padding-in-css-cascading-style-sheet-and-how-to-use-it  
category: "css-css3"  
tags: ["css"]  
reading_time: 2 minutes  

---

# What is Padding in CSS (Cascading style Sheet) and how to use it ?

It is to control the spaces around the content.

there is two way by which we can declare this property:\
\
**1st method**

```
p {    padding-top: 80px;
    padding-right: 60px;
    padding-bottom: 40px;      padding-left: 10px;    } 
```

**2nd method**\
\

```
p {padding: 50px 20px 80px 60px;}
```

**In the above example, if there is only three value. For example**

```
p {padding: 50px 20px 80px;}
```

Then top value will be 50px

Left –right value will be 20px

And button 80px

**if there is only two value. for example**\

```
 p {    padding: 50px 20px;    }
```

Then top & bottom value will be 50px

And Left –right value will be 20px

**If there is only one value. for example** \

```
p {    padding: 50px;  }
```

Then top bottom Left & right all have value 50px.

## Answers

### Answer by Abhishek Srivasatava

It is to control the spaces around the content.

there is two way by which we can declare this property:\
\
**1st method**

```
p {    padding-top: 80px;
    padding-right: 60px;
    padding-bottom: 40px;      padding-left: 10px;    } 
```

**2nd method**\
\

```
p {padding: 50px 20px 80px 60px;}
```

**In the above example, if there is only three value. For example**

```
p {padding: 50px 20px 80px;}
```

Then top value will be 50px

Left –right value will be 20px

And button 80px

**if there is only two value. for example**\

```
 p {    padding: 50px 20px;    }
```

Then top & bottom value will be 50px

And Left –right value will be 20px

**If there is only one value. for example** \

```
p {    padding: 50px;  }
```

Then top bottom Left & right all have value 50px.


---

Original Source: https://www.mindstick.com/interview/23083/what-is-padding-in-css-cascading-style-sheet-and-how-to-use-it

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.
