0

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 table shrinks?

Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
Eds
  • 533
  • 4
  • 16
  • 35

2 Answers2

1

Set image width to 100% as well.

If this doesn't help set it to auto!

#img{width:100%;}

or

#img{width:auto;}
DimDqkov
  • 155
  • 1
  • 3
  • 10
  • With a width of 100%, the image gets stretched out to fit the cell..width a width specified as auto nothing happens. – Bas Slagter Sep 15 '11 at 13:51
  • Hi, have tried both of the above, but the image does not appear to resize. is it possible that the width:100%; is actually referring to its original dimensions? so its 100% of original size rather than cell size? – Eds Sep 15 '11 at 13:59
  • This seems to be working `
    abc
    abc
    `     – DimDqkov Sep 15 '11 at 14:17
0

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.

Bas Slagter
  • 9,831
  • 7
  • 47
  • 78
  • 1
    I have given the div tag method a go, but for some reason does not appear to work, although I am using inline styling rather than an attached stylesheet. I think scripting will be my next plan of actioon. Thanks, Eds – Eds Sep 15 '11 at 13:57
  • I guess you are right about the div overflow not working (just checked it). Sorry about that. The scripting approach must be a better option. Good luck! – Bas Slagter Sep 15 '11 at 14:01