CSS Border Spacing

The CSS border-spacing property is used to specify the distance between the borders of adjacent table cells. The border-spacing property only applies to table elements.

The border-spacing property accepts two values:

1. horizontal: sets the horizontal distance between the borders of adjacent cells
2. vertical: sets the vertical distance between the borders of adjacent cells

Here’s an example of using the border-spacing property to specify the distance between the borders of adjacent table cells:

table {
   border-spacing: 10px 5px;
}

In this example, the border-spacing property is set to 10px for horizontal spacing and 5px for vertical spacing. This means that there will be a 10 pixel space between the left and right borders of adjacent cells and a 5 pixel space between the top and bottom borders of adjacent cells.

If you want to specify the same distance for both horizontal and vertical spacing, you can use a single value for the border-spacing property, like this:

table {
   border-spacing: 10px;
}

In this example, the border-spacing property is set to 10px, which means that there will be a 10 pixel space between the borders of adjacent cells both horizontally and vertically.

By using the border-spacing property, you can control the spacing between the borders of adjacent table cells, allowing you to create a well-organized and visually appealing HTML table.