HTML Table Spacing
By default, 2px space is set between the table border and cell border, and between two adjacent cell borders. We can change this spacing using CSS border-spacing
property.
Assign a valid CSS Length unit to border-spacing, like 10px, 1em, etc.
Examples
Border Spacing of 20px
In the following example, we set the border-spacing of 20px to the table.
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<style>
table, th, td {
border: 1px solid red;
}
table {
border-spacing: 20px;
}
</style>
</head>
<body>
<table>
<thead>
<th>Name</th>
<th>Quantity</th>
</thead>
<tbody>
<tr>
<td>Apple</td>
<td>25</td>
</tr>
<tr>
<td>Banana</td>
<td>18</td>
</tr>
</tbody>
</table>
</body>
</html>
Conclusion
In this HTML Tutorial, we learned about HTML table border spacing, with examples.