Simple table problem - using rowspan

but I can't work it out

[John_Caius]

I want a table in the following format:

<TABLE BORDER="1">
<TR>
<TD>1</TD>
<TD ROWSPAN="2">2<BR>2.5</TD>
</TR>
<TR>
<TD ROWSPAN="2">3<BR>3.5</TD>
</TR>
<TR>
<TD>4</TD>
</TR>
</TABLE>

but I want the cell number 1 to be just the height of the text filling it, and the same for cell number 4. I thought this layout would automatically work like that but it doesn't. I'm using IE6.

All assistance gratefully received... :)

[lukeurtnowski]

you might want to try VALIGN="?" on the tds' of 1 and 4

[John_Caius]

Tried that, it has just the same effect as VALIGN="top" but the cell is still taller than it should be. I want the height of the cell to be just the height of the cell contents. Any other ideas?

[John_Caius]

Solved it, using some helpful tips elsewhere, following a Google search for "table cell height troubleshooting". Basically you need to create an extra column with width="0" to tell the browser what happens in the middle row of the three. So this is the amended code:

<TABLE BORDER="1" cellspacing="0" cellpadding="0">
<TR>
<TD VALIGN="?">1</TD>
<TD height="20" width="0"></TD>
<TD ROWSPAN="2">2<BR>2.5</TD>
</TR>
<TR>
<TD ROWSPAN="2">3<BR>3.5</TD>
<TD height="20" width="0"></TD>
</TR>
<TR>
<TD height="20" width="0"></TD>
<TD VALIGN="?">4</TD>
</TR>

I haven't worked out why this works if the TD height is set to 20 but it doesn't work if it's set to 5.