Hello<br />
<br />
Assume I have a very large image that I would like to display.<br />
I would like to place the image inside a table cell like so:<br />
<br />
<table width="100% height="100%"><br />
<tr><br />
<td width="150px"><br />
<!-- some content --><br />
</td><br />
<td width="100%"><br />
<!-- image goes here --><br />
</td><br />
<td width="150px"><br />
<!-- some content --><br />
</td><br />
</tr><br />
</table><br />
<br />
Even though the cell of the image has width 100%, I wouldn't want the table to get large enough for a horizontal scrollbar to appear.<br />
Note, that the width of the image can be potentially very large.<br />
I would like the browser to re-render the image in such dimensions so that the image will not be distorted, and no horizontal scrollbar will appear.<br />
This means that the width of the drawn image will be as large as possible as long as no horizontal scrollbar is needed. Of course the height needs to be calculated correctly so that the image will not be distorted.<br />
<br />
If the original width of the image is smaller than the available width for the table, just use the original width for the image.<br />
<br />
is that possible? <br />
I would appreciate any help in code.<!--content--><img src=http://www.webdeveloper.com/forum/archive/index.php/"image" alt="yourimage" style="width:100%;"><br />
just setting the width to 100% will ensure that is has a 100% width of its container. The height will change in proportion to the original with the width, so it should not get too bad. There will have to be minor distortion of course with any size change (but even if you resize the image in photoshop, you will have the same thing happen).<!--content-->I have set the width to 100% but it has no effect. The image is displayed in its original dimensions (very large)<br />
<br />
here is a sample of my code:<br />
<br />
<table cellpadding="0" cellspacing="0" height="100%" width="100%" border="0"><br />
<tr><br />
<td align="center"><br />
<img id="image_1423" src=http://www.webdeveloper.com/forum/archive/index.php/"myImage.jpg" alt="Test" style="width:100%"><br />
</td><br />
</tr><br />
</table><!--content-->Well if the table is 100% the image will be 100%. I thought you wanted its width to fill the cell? You can give the image another width value. It can be an absolute pixil value like 500px; or it can be another percentl like 50%;.<!--content-->
<br />
Assume I have a very large image that I would like to display.<br />
I would like to place the image inside a table cell like so:<br />
<br />
<table width="100% height="100%"><br />
<tr><br />
<td width="150px"><br />
<!-- some content --><br />
</td><br />
<td width="100%"><br />
<!-- image goes here --><br />
</td><br />
<td width="150px"><br />
<!-- some content --><br />
</td><br />
</tr><br />
</table><br />
<br />
Even though the cell of the image has width 100%, I wouldn't want the table to get large enough for a horizontal scrollbar to appear.<br />
Note, that the width of the image can be potentially very large.<br />
I would like the browser to re-render the image in such dimensions so that the image will not be distorted, and no horizontal scrollbar will appear.<br />
This means that the width of the drawn image will be as large as possible as long as no horizontal scrollbar is needed. Of course the height needs to be calculated correctly so that the image will not be distorted.<br />
<br />
If the original width of the image is smaller than the available width for the table, just use the original width for the image.<br />
<br />
is that possible? <br />
I would appreciate any help in code.<!--content--><img src=http://www.webdeveloper.com/forum/archive/index.php/"image" alt="yourimage" style="width:100%;"><br />
just setting the width to 100% will ensure that is has a 100% width of its container. The height will change in proportion to the original with the width, so it should not get too bad. There will have to be minor distortion of course with any size change (but even if you resize the image in photoshop, you will have the same thing happen).<!--content-->I have set the width to 100% but it has no effect. The image is displayed in its original dimensions (very large)<br />
<br />
here is a sample of my code:<br />
<br />
<table cellpadding="0" cellspacing="0" height="100%" width="100%" border="0"><br />
<tr><br />
<td align="center"><br />
<img id="image_1423" src=http://www.webdeveloper.com/forum/archive/index.php/"myImage.jpg" alt="Test" style="width:100%"><br />
</td><br />
</tr><br />
</table><!--content-->Well if the table is 100% the image will be 100%. I thought you wanted its width to fill the cell? You can give the image another width value. It can be an absolute pixil value like 500px; or it can be another percentl like 50%;.<!--content-->