Problem with cell width (100%)

[Guest]

I am having a problem with a cell in a table in ASP.NET which used to work OK
in classic ASP. I have one cell in a row where the width should be 22 pixels
and the other cell should take up the remainder of the width available. In
ASP.NET the 2nd cell (when set to 100%) is 500 pixels wide (hence overlapping
the image in row 1), wheras in classic ASP the cell would have a width of
500-22 = 478 pixels (thus filling the remainder of the available space).

How do I do this in ASP.NET (I've tried setting the width to * but it
doesn't take up the remainder of the space)?

Classic ASP:

<table cellpadding="0" cellspacing="0"
style="background-color:#F2F2F2;width: 500px">
<tr><td colspan="2"><img src="/Images/top.gif" width=500 height=4></td></tr>
<tr>
<td width=22><img src="/Images/top.gif" width=22 height=22></td>
<td width:100%>The Cell</td>
</tr>
</table>

ASP.NET:

<table cellpadding="0" cellspacing="0"
style="background-color:#F2F2F2;width: 500px">
<tr><td colspan="2"><asp:Image ID="Image1" runat="server"
ImageUrl="~/Images/top.gif" /></td></tr>
<tr>
<td><asp:Image ID="Image4" runat="server" ImageUrl="~/Images/starbucks.gif"
/></td>
<td style="width:100%">The Cell</td>
</tr>
</table>

 

[S. Justin Gengo [MCP]]

Hiwj,

It looks like in your example for asp.net you have not set the first cell's
width to 22. After doing that you shouldn't even need to specify the second
cell's width because it should automatically take up the rest of the 500px
that the table is set to.

--
Sincerely,

S. Justin Gengo, MCP
Web Developer / Programmer

www.aboutfortunate.com

"Out of chaos comes order."
Nietzsche

 

[Guest]

Justin

I have tried setting the width of the 1st column to 22px, but it doesn't
work (possibly due to the first row having a single cell with a colspan=2). I
have tried it with just one row and it works as you say.

I've tried setting the cell in the 1st row to width:500px, the 1st cell in
the 2nd row to 22px and leaving the 2nd cell in the 2nd row with no width (to
'fill' the remainder of the width), but it just doesn't seem to work.

Why does the colspan=2 affect the 2nd row?

Huw

 

[S. Justin Gengo [MCP]]

Hiwj,

The other difference is that in your original example the image is
specifically set to 500px wide. That will automatically increase the size of
the top cell.

--
Sincerely,

S. Justin Gengo, MCP
Web Developer / Programmer

www.aboutfortunate.com

"Out of chaos comes order."
Nietzsche

 

[Guest]

I seem to have found a solution that works:

Add style="table-layout:fixed" to the TABLE tag and use

<col width="26px" />
<col width="*" />

before the TR tag.

There must be a few more tags and styles which I was not aware of that
affected table layout in .NET. Anyway, thanks for the help.

Huw