CSS & Tables, bigger in IE?

Table width off by a few pixels in IE

[max4]

Hi,

This is my first attempt at designing a table using an external css document. I didn't want to mess with the original HTML table design so I decided to first convert the already existent HTML code into CSS. Here is the HTML that I started with:

<table border="0" width="800" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="800" align="center" valign="middle">
<table border="0" width="800" align="center" cellpadding="0" cellspacing="0" style="font-size:12px; background-image:url(../../img/top.jpg);">

After CSS conversion, the code looks like this:

/* External CSS Document */
table.a {
border-width:0px;
width:800px;
padding:0px;
border-spacing:0px;
}

table.b {
border-width:0px;
width:800px;
font-size:12px;
padding:0px;
border-spacing:0px;
background-image:url(../../img/top.jpg);
}

<!--HTML-->
<table align="center" class="a">
<tr>
<td width="800" align="center" valign="middle">
<table align="center" class="class3 b">

All of this works perfectly in Firefox, but in IE the second table becomes 5 pixels wider and 4 pixels taller. The background image starts to repeat and all of my meticulously positioned text and fields become terribly misaligned. How can this be corrected?

Much thanks in advance,
Max

[edited by: max4 at 6:36 pm (utc) on June 5, 2008]

[max4]

After looking at the code, I realized that I didn't need that first table. So the code looks like this now:

table.a {
border-width:0px;
width:800px;
font-size:12px;
padding:0px;
border-spacing:0px;
background-image:url(../../img/top.jpg);
}

<table align="center" class="class3 a">

The table should have a fixed width of 800px and a height of 61px to conform to it's background image. I used a calculator to check and recheck all <td> attributes and everything adds up to the designed width of 800px and height of 61px; yet in ie the width becomes 805px and the height becomes 65px. This is terribly annoying.

'class3' only contains font colors. I'm using XHTML 1.0 Transitional.

-------------
Edit
-------------

I have isolated the problem to the cellspacing attribute. IE does not seem to recognize the css border-spacing attribute. Anyone know of any alternatives that I can use?

[appi2]

Not sure but try

border-collapse: collapse

[max4]

Thanks for the reply, that method seems to work under some instances but not others. I've decided to just stick with the html cellspacing attribute.