Difference between Cellpadding and Cellspacing

Cellpadding:

Cellpadding specifies the space between the border of a table cell and its contents (i.e) it defines the whitespace between the cell edge and the content of the cell.

Syntax:
```
<table cellpadding="value" >.....</table>
where, value determines the padding 
(space between the border of a table and its content)
```
Cellspacing:

Cellspacing specifies the space between cells (i.e) it defines the whitespace between the edges of the adjacent cells.

Syntax:
```
<table cellspacing="value" >.....</table>
where, value determines the padding 
(space between adjacent cells)
```

Example:

<!DOCTYPE html> 

<html lang="en"> 

<head> 

    <meta charset="UTF-8"> 

    <meta name="viewport" 

          content="width=device-width,  

                   initial-scale=1.0"> 

    <title>Document</title> 

    <style> 

        span{ 

          text-decoration-style: solid; 

          width: 25px; 

          font-size: x-large; 

          color: blueviolet; 

        } 

      </style> 

</head> 

<body> 

<table border="1" 

       cellpadding="4"

       cellspacing="5"> 

  <thead> 

  <td><span>Name</span></td> 

  <td><span>Age</span></td> 

  </thead> 

  <tbody> 

  <tr> 

    <td>Rani</td> 

    <td>30</td> 

  </tr> 

   <tr> 

    <td>Rajan</td> 

    <td>35</td> 

  </tr> 

  <tr> 

    <td>Akshaya</td> 

    <td>17</td> 

  </tr> 

  <tr> 

    <td>Ashick</td> 

    <td>13</td> 

  </tr> 

  </tbody> 

</table> 

</body> 

</html>

Output:

Difference between cellpadding and cellspacing:

Cellpadding	Cellspacing
It specifies the space between the border of a table cell and its contents.	It specifies the space between adjacent cells.
It is created by using HTML <table> tag but type attribute is set to cellpadding.	It is also created by using HTML <table> tag but type attribute is set to cellspacing.
It is mainly meant for a single cell.	Cellspacing can get subjected to more than one cell.
The default cellpadding value is 1	Whereas, the default cellspacing value is 2
Cellpadding is widely used and considered to be an effective mean	Cellspacing is less effective than Cellpadding.
Cellpadding is an attribute	Cellspacing is also an attribute.

Article Tags :

HTML

Web Technologies

HTML-Basics