CSS+HTML: How to draw table/cell border - html

Question

Here is my CSS code for table:
table.t_data
{
/* border: 1px; - **EDITED** - doesn't seem like influences here */
background-color: #080;
border-spacing: 1px;
margin: 0 auto 0 auto;
}
table.t_data thead th, table.t_data thead td
{
background-color: #9f9;
/* border: #080 0px solid; - **EDITED** - doesn't seem like influences here */
padding: 5px;
margin: 1px;
}
table.t_data tbody th, table.t_data tbody td
{
background-color: #fff;
/* border: #080 0px solid; - **EDITED** - doesn't seem like influences here */
padding: 2px;
}
I need to display the following HTML:
<table class="t_data">
<thead style="padding:1px">
<tr>
<th>#</th>
<th>Team</th>
<th>Stadium Name</th>
<th>Size</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>Team 1</td>
<td>Name 1</td>
<td>Size 1-1, 2-1, 3-1</td>
</tr>
<tr>
<td>2</td>
<td>Team 1</td>
<td>Name 1</td>
<td>Size 1-1, 2-1, 3-1</td>
</tr>
<tr>
<td>3</td>
<td>Team 1</td>
<td>Name 1</td>
<td>Size 1-1, 2-1, 3-1</td>
</tr>
</tbody>
</table>
It display perfect (as expected) table in Mozilla Firefox and in IE8:
But there are issues in other browsers/modes:
In Chrome the line between head and body is double width:
In IE8 (switched into IE7 compatibility mode) all lines are double width:
Question: what are CSS options to make each line boldness same (1px)?

Answer 1

table.t_data { border-collapse:collapse }