Kaptinlin Themes Support

I've had some difficulty with the table border going beyond the width property thats assigned in Safari 5.0.3 and Firefox 3.6.13.

For example:

[styled_table]
<table style="width: 80%;" border="0" cellspacing="3" cellpadding="5" align="center">
<tbody>
<tr>
<th colspan="4" valign="middle" scope="row">Header Row</th>
</tr>
<tr>
<td>Data</td>
<td>Data</td>
<td>Data</td>
<td>Data</td>
</tr>
</tbody>
</table>
[/styled_table]

Produces:


So as a work-around, I've had to use the DIV tag to control the table border and width.

For example:

<div style="width: 80%;">
[styled_table]
<table style="width: 100%;" border="0" cellspacing="3" cellpadding="5" align="center">
<tbody>
<tr>
<th colspan="4" valign="middle" scope="row">Header Row</th>
</tr>
<tr>
<td>Data</td>
<td>Data</td>
<td>Data</td>
<td>Data</td>
</tr>
</tbody>
</table>
[/styled_table]
</div>


Produces:


I looked through the CSS and the only property I found that I thought might be affecting it was here:

.table_style table
{
text-align: left;
border-collapse: collapse;
border: 1px solid #fff;
width:100%;
padding:0;
margin:0;
}

However, when I removed the width property the problem didn't go away. Any thoughts?
This is what it looks like in Internet Explorer 8: