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. |
Please Login to comment...