making image height 100% of the table height

[tabsquare]

hi,
how can I make the height of an image resize to fit the height of the table cell?

I tried
<td><img src="image.gif" width="10" height="100%"></td>

it doesn't seem to work tough. I don't know why.

thanks

[Morris Cornet]

Hi

height=100% is not allowed for use with images. You can only set the height of images in an absolute manner: i.e. height="600"
The only solution I can think of someway getting the height of all images on one table row, and then resizing all images to the height of the image of greatest height.

This appears to be possible in ASP. Maybe this one (altough used in another way than you need it) will get you started:
http://www.4guysfromrolla.com/webtech/050300-1.shtml

It also looks like there are applications and scripts for this. Take a look at http://cgi.resourceindex.com or so.

I may be skipping the simplest of solutions. I am in doubt, for example, if this could be done with simple JavaScript. Maybe someone else knows.

Morris Cornet

[xhtmlcoder]

It's not really a good idea to tell the one image to be stretched percentage and fixed by numeric absolute.

However, it would be possible to get a similar effect assuming your <td> was given an absolute height because the 100% would be only 100% of the given <td> height.

[tabsquare]

However, it would be possible to get a similar effect assuming your <td> was given an absolute height because the 100% would be only 100% of the given <td> height.

it's quite impossible for me, or at least very hard, to give an absolute value to the <td> height property since the content within the cell is dinamically generated with ASP and showing user inputs in the form of text, images and also html.

The only solution I can think of someway getting the height of all images on one table row, and then resizing all images to the height of the image of greatest height.

If I understand what you mean, this would be uneuseful if the the content determining the height of the cell is text. Is that correct? Unfortunatly that is my case. I am anyway reading the article at 4guysfromrolla since it seems interesting.

I too think that maybe javascript could do the trick. Maybe using a function to get the current height of the cell and applying that height to the image height.
Will try to get something out of this...

[notepad_coder]

To do that you have to specify the height in <td> as well

<table width=50 height=500>
  <tr>
    <td width=50 height=500><img src="image.gif" width=50 height="100%"></td>
  </tr>
</table> 

[tabsquare]

yeah that's true. I just tried out using even 0 as the height of the <td>. The cell exapands when it's filled with content and therefore the image with a 100% height fills all the cell height.

thanks all for the help