Here is the HTML code that I am working with:
<table>
<tr>
<td class='tclone' id='clone'></td>
<td class='loader' id='loader'>
<div id='tdiv' style="height:630px; width:835px; overflow:auto;"></div>
</td>
</tr>
</table>
I have JavaScript functionality set up to dynamically append content to tclone and tdiv elements when this HTML is opened in a new window. tdiv specifically loads an image, which was causing overflow beyond the window size. To address this issue, I added width and height parameters to the div element, as well as allowed scroll-bars inside the td element. While this approach works fine for fixed window sizes, I am looking for a way to automatically resize the div element and adjust its scroll-bars whenever the user resizes the window.
Are there any suggestions on how to achieve this dynamic resizing behavior?