Who's REALLY good with HTML?

[Bubble #5]

We're trying to make a table for our first 3.5.0 skin. When we view it in IE and firefox it looks OK (see screenshots below) but when we view it in Safari it's not tiling correctly The only thing that we can figure is that there must be something wrong with the HTML, or that something is affecting the HTML, but it's a default vB forum with no hacks installed so I don't see how anything could be affecting the HTML (even though that's how it's acting when you view it). Below is the HTML for the table. The table is broken into 3 sections, top, middle and bottom.

<!-- top section -->
<table cellpadding="0" cellspacing="0" border="0" width="100%" align="center">
<tr>
<td width="10" height="32"><img src="$stylevar[imgdir_misc]/pic1.png" /></td>
<td width="10" height="32"><img src="$stylevar[imgdir_misc]/pic2.png" /></td>


<td width="100%" height="32" background="$stylevar[imgdir_misc]/pic3.gif" valign="middle" class="pic2"><center>vbphrase</center></td>


<td width="10" height="32" align="right"><img src="$stylevar[imgdir_misc]/pic4.png" /></td>
<td width="10" height="32" align="right"><img src="$stylevar[imgdir_misc]/pic5.png" /></td>
</tr>
<!-- / End top section -->



<!-- mid section -->
<tr>
<td background="$stylevar[imgdir_misc]/pic7.gif" valign="top"><img src="$stylevar[imgdir_misc]/pic7.gif" /></td>
<td colspan="3">
<table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center">
</table>
</td>
<td background="$stylevar[imgdir_misc]/pic9.gif" valign="top"><img src="$stylevar[imgdir_misc]/pic9.gif" /></td>
</tr>
</table>
<!-- / End mid section -->

<!-- bottom section -->
<table cellpadding="0" cellspacing="0" border="0" width="100%" align="center">
<tr>
        <td width="10" align="left" valign="top"><img src="$stylevar[imgdir_misc]/pic10.png" width="10" height="32" /></td>
  <td width="10" align="left" valign="top"><img src="$stylevar[imgdir_misc]/pic11.png" height="32" /></td>
        <td  width="100%" style="background-image:url($stylevar[imgdir_misc]/pic12.png)"><img src="$stylevar[imgdir_misc]/pic12.png" width="1" height="32" alt=" " border="0" /></td>
        <td width="10" align="right" valign="top"><img src="$stylevar[imgdir_misc]/pic13.png" height="32" /></td>
  <td width="10" align="right" valign="top"><img src="$stylevar[imgdir_misc]/pic14.png" height="32" /></td>
      </tr>
    </table>
<!-- End bottom section -->

The only part that is looking wrong on Safari is the middle of the top portion of the table. The rest of the table looks good in all browsers, even Safari. Here is the HTML for the section which looks bad:

<td width="100%" height="32" background="$stylevar[imgdir_misc]/pic3.gif" valign="middle" class="pic2"><center>vbphrase</center></td>

Are there any really good HTML'ers that can look at the HTML above and see if anything is wrong with the way it's written? I know the table itself works because it works in another part of the forum (even with Safari). I looked at templates until 5:00 in the morning last night :ermm: and I'm pulling my hair out Hopefully a fresh set of eyes from someone really good with HTML can pick out what's wrong. I'd appreciate it. Thank you.