HTML tables offer options to adjust the padding within cells as well as the spacing between cells.
Cell padding refers to the distance between the edges of a cell and its content.
By default, this padding is set to 0.
To apply padding to table cells, utilize the CSS padding property.
Example
| th, td { padding: 15px; } |
To exclusively include padding above the content, employ the padding-top property.
For the remaining sides, utilize the padding-bottom, padding-left, and padding-right properties.
Example
| th, td { padding-top: 10px; padding-bottom: 20px; padding-left: 30px; padding-right: 40px; } |
Cell spacing refers to the gap between each cell, typically set to a default of 2 pixels.
To adjust the space between table cells, apply the CSS border-spacing property to the table element.
Example
| table { border-spacing: 30px; } |
