HTML/CSS/CSS Attributes and Javascript Style Properties/border collapse
"border-collapse" Example
<html>
<body>
<table id="myTable" border="1" style="border-collapse:collapse">
<tr>
<td>column 1</td>
<td>column 2</td>
<td>column 3</td>
</tr>
<tr>
<td>cell 1</td>
<td>cell 2</td>
<td>cell 3</td>
</tr>
<tr>
<td>cell 1</td>
<td>cell 2</td>
<td>cell 3</td>
</tr>
</table>
<button onclick="myTable.style.borderCollapse="separate"">separate</button>
<button onclick="myTable.style.borderCollapse="collapse"">collapse</button>
</body>
</html>
border-collapse: separate
<?xml version="1.0" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>CSS Example</title>
<style rel="stylesheet" type="text/css">
table {
background-color: #efefef;
width: 350px;
border-collapse: separate;
empty-cells: hide;
}
td {
padding: 5px;
border-style: solid;
border-width: 1px;
border-color: #999999;
}
</style>
</head>
<body>
<table>
<tr>
<th></th>
<th>Title one</th>
<th>Title two</th>
</tr>
<tr>
<th>Row Title</th>
<td>value</td>
<td>value</td>
</tr>
<tr>
<th>Row Title</th>
<td>value</td>
<td></td>
</tr>
</table>
</body>
</html>