Table spacing in html - html

Question

For what ever reason, I get a small gap in between the two TD cells (Lines dont touch).
There is no padding or margin on that side... I did this collapsing idea.
Why is it there? http://jsfiddle.net/CKy6U/
My html:
<table>
<tr>
<td>
TEST CELL 1
</td>
<td>
TEST CELL 2
</td>
</tr>
</table>
my CSS:
table
{
width: 100%;
}
tr
{
border-bottom: 1px solid Black;
}
td
{
border-collapse: separate;
border-spacing: 0px;
border-left: 1px solid Black;
border-bottom: 1px solid Black;
padding: 3px;
width: 50%;
}
My Result:

Answer 1

Add Border Collapse for table.
table
{
width: 100%;
border-collapse:collapse;
}
DEMO

Answer 2

Add border-right: 0px; to and remove border-collapse: separate from the td. Add border-collapse: collapse to the table.
Fiddle: http://jsfiddle.net/CKy6U/7/

Answer 3

Try like this: LINK
CSS:
table {
width: 100%;
border-collapse:collapse;
}

Answer 4

use normalize.css or an css reset
Also I would add
<table cellspacing="0" cellpadding="0"> ... </table>

Answer 5

Remove the border-collapse on the td and add it to the table
table{
width: 100%;
border-collapse: collapse;
}
tr{
border-bottom: 1px solid black;
}
td{
border-spacing: 0px;
border-left: 1px solid black;
border-bottom: 1px solid black;
padding: 3px;
width: 50%;
}

Answer 6

You have to add border-collapse: collapse in your table or cellspacing="0" in your html table.
css
table {
width: 100%;
border-collapse: collapse;
}
fiddle
html:
<table cellspacing="0">
fiddle
Both solutions should work. But use border-colapse cause as #Mooseman comment cellspacing is obsolete in html5.