Cellpadding
Cell padding specifes the space between the cell content and it's borders.
HTML tables can adjust the padding inside the cells, and also the space between the cells. Cell padding is the space between the cell edges and the cell content. By default the padding is set to 0. To add padding on table cells, use the CSS <padding> property.
| Firstname |
Lastname |
Age |
| Jill |
Smith |
50 |
| Eve |
Jackson |
94 |
| John |
Doe |
80 |
To add padding only above the content, use the <padding-top> property. And the others sides with the <padding-bottom>, <padding-left>, and <padding-right> properties.
Tip: Try to change the padding to 5px.
Cellpadding - top - bottom - left - right
We can specify different padding for all fours sides of the cell content.
| Firstname |
Lastname |
Age |
| Jill |
Smith |
50 |
| Eve |
Jackson |
80 |
| John |
Doe |
80 |
Cellspacing
Change the space between the cell with border-spacing property.
Cell spacing is the space between each cell. By default the space is set to 2 pixels. To change the space between table cells, use the CSS <border-spacing> property on the <table> element.
| Firstname |
Lastname |
Age |
| Jill |
Smith |
50 |
| Eve |
Jackson |
94 |
| John |
Doe |
80 |