Difference between Cellspacing and Cellpadding

Cellspacing and Cellpadding are two important attributes of  <Table> tag. As you know <Table> tag is used to create and display tables in HTML documents.

What is CELLSPACING?

Cellspacing is an important attribute of <Table> tag in HTML. Cellspacing specifies the spacing between adjacent cells in a table. Consider the following example of an HTML table with cellspacing attribute set to 50.

Example of Cellspacing use

<TABLE border="1" cellspacing="30">
<th>Name</th><th>Marks</th>
<tr><td>Sajid Mahmood</td><td>666</td>
<tr><td>Majid Karim</td><td>555</td>
</table>

Name	Marks
Sajid Mahmood	666
Majid Karim	555

Example of Cellspacing=15

<TABLE border="1" cellspacing="15">
<th>Name</th><th>Marks</th>
<tr><td>Sajid Mahmood</td><td>666</td>
<tr><td>Majid Karim</td><td>555</td>
</table>

Name	Marks
Sajid Mahmood	666
Majid Karim	555

Example of Cellspacing=0

<TABLE border="1" cellspacing="0">
<th>Name</th><th>Marks</th>
<tr><td>Sajid Mahmood</td><td>666</td>
<tr><td>Majid Karim</td><td>555</td>
</table>

Name	Marks
Sajid Mahmood	666
Majid Karim	555

What is CellPadding?

Cellpadding is used to specify the distance between a cell contents and its boundaries. For example, consider the following table with cellpadding=0

Example of Cellpadding=0

<TABLE border="1" cellpadding="0">
<th>Name</th><th>Marks</th>
<tr><td>Sajid Mahmood</td><td>666</td>
<tr><td>Majid Karim</td><td>555</td>
</table>

Name	Marks
Sajid Mahmood	666
Majid Karim	555

Example of Cellpadding=20

<TABLE border="1" cellpadding="20">
<th>Name</th><th>Marks</th>
<tr><td>Sajid Mahmood</td><td>666</td>
<tr><td>Majid Karim</td><td>555</td>
</table>

Name	Marks
Sajid Mahmood	666
Majid Karim	555

Example of Cellpadding=50

<TABLE border="1" cellpadding="50">
<th>Name</th><th>Marks</th>
<tr><td>Sajid Mahmood</td><td>666</td>
<tr><td>Majid Karim</td><td>555</td>
</table>

Name	Marks
Sajid Mahmood	666
Majid Karim	555