Java News Tips Software
Java News Tips Software | Contact | Facebook | Twitter RSS

Cellspacing vs cellpadding - Table attributes comparison

In HTML Tables (<table>) there are two attributes named, cellpadding and cellspacing. What is the different between cellpadding and cellspacing? Both these are capable of creating some empty space inside a table.

cellspacing : space between cells
cellpadding : space between the cell border and it's content

Look at the diagram to clarify this further. As the word "cellspacing" suggests, it denotes the spacing between cells; it is something easy to remember. "cellpadding" keyword can be considered in relation to the "padding" attribute in HTML/CSS; padding is used to denote the space between the content and border of box type elements.

Following is a simple code example to demonstrate the difference.

<table cellspacing="15px" cellpadding="20px" bgcolor="#00EE00" width="300px">
<tr>
<td
bgcolor="#339966">
<div
style="background:#FFFFFF;">Cell 1 content</div>
</td>

<td bgcolor="#339966">
<div
style="background:#FFFFFF;">Cell 2</div>
</td>

</tr>
</table>

Cell 1
Cell 2

Check the difference. We have set the table background to light green color, so all the cellspacing is viewed in light green as it is the space between cells. The dark green sections are the spaces created with cellpadding; the space in white is available for the content in table cell.

Labels: ,


3 Comments

  1. This is a Wonderful informative it is a very useful to me thanks dear to share such an excellent informative post.
  2. Anonymous Anonymous on January 17, 2014 1:53 AM  
    This comment has been removed by a blog administrator.
  3. This comment has been removed by a blog administrator.
ABOUT AUTHOR
Page Views :
Email :
PREVIOUS ARTICLES
Select Month:
TOP
Free counter and web stats