The
border-spacing
property determines the distance between the border of two adjacent cells. This property allows you to specify different spacing values horizontally and vertically.
The possible values are
Values | Description |
---|
<length> | horizontal_distance=vertical_distance |
<length> <length> | horizontal_distance vertical_distance |
snippet
<html>
<head>
<style>
table {border: 1px solid blue;}
table td {border: 1px solid red;}
</style>
</head>
<body>
<table cellspacing="10">
<tr><td>data 1</td><td>data 2</td><td>data 3</td></tr>
<tr><td>data 4</td><td>data 5</td><td>data 6</td></tr>
<tr><td>data 7</td><td>data 8</td><td>data 9</td></tr>
</table>
<table style="border-spacing:10px 20px;">
<tr><td>data 1</td><td>data 2</td><td>data 3</td></tr>
<tr><td>data 4</td><td>data 5</td><td>data 6</td></tr>
<tr><td>data 7</td><td>data 8</td><td>data 9</td></tr>
</table>
</body>
</html>