I have a table within a table and there are these phantom borders. For the life of me I have tried so many things to kill these extra spaces and I do not know how to get rid of them. Check out the jsfiddle
body{
background: #ddd;
}
.outterTbl{
border-collapse: collapse;
border-spacing: 0px;
background: green;
}
.outterTbl th{
background: black;
color: white;
}
.outterTbl td{
margin: 0px;
border-spacing: 0px;
border: none;
}
.innerTbl{
border-collapse: collapse;
border-spacing: 0px;
text-align: center;
}
.innerTbl th{
background: #3399cc;
color: white;
}
.innerTbl tr:nth-child(odd) {
background: white;
}
.innerTbl tr:nth-child(even){
background: #9ccde5;
}