Resize image in table below 100% when resizing window

I think similar questions have been answered, but none really seem to have helped me out that much.

I have a table that is set to width="100%" with a cell on the top row. This cell contains an image which is fairly wide. When I resize the window, and therefore the table, the image does not resize below 100% of its original size.

Is there a way to get this image to reduce in size as the tabl开发者_如何学Ce shrinks?

---

Set image width to 100% as well.

If this doesn't help set it to auto!

#img{width:100%;}

or

#img{width:auto;}

---

If you want it to actually get smaller than the specified width/height (or the original width/height) of the image, you need to do some scripting. This means you can hook up the resize event of the browser and reset the width/height of the image equally while resizing.

Another option is to wrap the image in a div with an overflow:hidden specified. So if the div gets to large for the window, it will hide the pieces of the image that fall outside the window.