Borders not aligned in scrollable table

[trickywiki]

Hi,
I've tried to implement a long data table with a vertical scroll bar so that the headings are always visible.
The problem is the data widths don't match the headings even though I've specified them.
Guidance in understanding where I've gone wrong would be appreciated.

Or if I'm going about this in the wrong way, I'm open to alternative solutions.

The chart can be seen on my website page http://www.kingsbarntrees.co.uk/acat...to_Choose.html.

The code for the whole table is very long, so I've only included the heading and first row of data below:


<table summary="" cellpadding="0" cellspacing="1" align="center"
title="" width="1000" border="0" bgcolor="black">

<table summary="" cellpadding="0" cellspacing="0" width="100%"
align="center" border="1">
<tr bgcolor="gray">
<td colspan="19" align="center"><b>Eucalyptus Selection Table</b></td>
</tr>
<tr bgcolor="silver">
<td width="80">Species</td>
<td width="69">Common Name</td>
<td width="44">Mature Height (m)</td>
<td width="50">Growth Rate</td>
<td width="60">Hardiness</td>
<td width="35">Wet Soil</td>
<td width="29">Clay Soils</td>
<td width="57">Exposure</td>
<td width="38">Shade</td>
<td width="35">Lime</td>
<td width="40">Hedge</td>
<td width="50">Floristry</td>
<td width="51">Biomass</td>
<td width="24">Pot</td>
<td width="52">Coppice</td>
<td width="62">Interesting Leaf</td>
<td width="62">Interesting Flower</td>
<td width="62">Interesting Bark</td>
<td width="42">Aroma</td>
</tr>
</table>
</td>
</tr>

<tr>
<td>
<div style="width:100%; overflow:scroll;height:300px;">
<table summary="" cellpadding="0" cellspacing="0" width="96%"
bgcolor="#CCCC99" border=1>
<tr>
<td width=“80”>aggregata</td>
<td width=“69”>Black Gum</td>
<td width=“44”>20</td>
<td width=“50”>Medium</td>
<td width=“60”>***</td>
<td width=“35”>Yes</td>
<td width=“29”>&nbsp</td>
<td width=“57”>Yes</td>
<td width=“38”>&nbsp</td>
<td width=“35”>&nbsp</td>
<td width=“40”>&nbsp</td>
<td width=“50”>&nbsp</td>
<td width=“51”>&nbsp</td>
<td width=“24”>&nbsp</td>
<td width=“52”>&nbsp</td>
<td width=“62”>&nbsp</td>
<td width=“62”>&nbsp</td>
<td width=“62”>Yes</td>
<td width=“42”>&nbsp</td>
</tr>

[leehack]

You're opening up 2 table tags, if you keep it all within one, it will all act as one. Use <th> for the column headings and then have normal <td> underneath, the <td> will then be linked an exactly the same as the <th> then.

[trickywiki]

It was mainly a width issue. However the problem was compounded by the fact that I'd used Excel and then a text editor to compile the data and inadvertently used the wrong quotation marks i.e “” and not "".

Works OK now - thanks