iframes help

[nop86]

I am using iframes 'inside' an image. However, when I resize my window, the text stays in the same position but the image size changes relative to the window. How can I make the text move too?

Code as follows:
<base target="innermain">
<div id="ipain" style="position:absolute;bottom:0px;top:0px;right:390px">

<img src="ipain.jpg" width="450" height="570"></div>

<iframe name="innermain" allowtransparency="true" width="421" height="556" style="position: absolute; top:14px; left:208px" border-style: solid; border-width: 0" border="0" frameborder="0" src="text.html">
Your browser does not support inline frames or is currently configured not to display inline frames.</iframe>

<div id="content" style="position:absolute;bottom:0px;top:0px;right:0px;height:504px">
<table border="0" cellpadding="0" cellspacing="0">

<tr>

<td><img src="indexwork41-2.jpg" width="51" height="290" border="0"></td>
<td><img src="indexwork41-3.jpg" width="166" height="290" border="0"></td>
<td><img src="indexwork41-4.jpg" width="174" height="290" border="0"></td>
</tr>
<tr>

<td><img src="indexwork42-2.jpg" width="51" height="121" border="0"></td>
<td><a href=".html" onmouseover="swapImage( 'image1' , 'link1on.jpg' )" onmouseout="swapImage( 'image1' , 'link1.jpg' )">
<img src="link1.jpg" width="166" height="121" border="0" name="image1"></A></td>
<td><a href=".html" onmouseover="swapImage( 'image2' , 'link2on.jpg' )" onmouseout="swapImage( 'image2' , 'link2.jpg' )"><img src="link2.jpg" width="174" height="121" border="0" name="image2"></a></td>
</tr>
<tr>

<td><img src="indexwork43-2.jpg" width="51" height="159" border="0"></td>
<td><a href=".html" onmouseover="swapImage( 'image3' , 'link3on.jpg' )" onmouseout="swapImage( 'image3' , 'link3.jpg' )"><img src="link3.jpg" width="166" height="159" border="0" name="image3"></a></td>
<td><a href=".html" onmouseover="swapImage( 'image4' , 'link4on.jpg' )" onmouseout="swapImage( 'image4' , 'link4.jpg' )"><img src="link4.jpg" width="174" height="159" border="0" name="image4"></td>
</tr>
</table>
</div>

ANy help would be very much appreciated.
THANK YOU!

[TheBigT]

EDIT

Here is the good copy.

<base target="innermain">
<div id="ipain" style="position:absolute;bottom:0px;top:0px;left:30%;right:0px">

<img src="http://home.comcast.net/~allbonz89/sig.gif" width="450" height="570"></div>

<iframe name="innermain" allowtransparency="true" width="421" height="556" style="position: absolute; top:14px; left:30%" border-style: "solid"; border-width: "0" border="0" frameborder="0" src="text.html">
Your browser does not support inline frames or is currently configured not to display inline frames.</iframe>

<div id="content" style="position:absolute;bottom:0px;top:0px;left:30%;right:0px;height:504px">
<table border="0" cellpadding="0" cellspacing="0">

<tr>

<td><img src="indexwork41-2.jpg" width="51" height="290" border="0"></td>
<td><img src="indexwork41-3.jpg" width="166" height="290" border="0"></td>
<td><img src="indexwork41-4.jpg" width="174" height="290" border="0"></td>
</tr>
<tr>

<td><img src="indexwork42-2.jpg" width="51" height="121" border="0"></td>
<td><a href=".html" onmouseover="swapImage( 'image1' , 'link1on.jpg' )" onmouseout="swapImage( 'image1' , 'link1.jpg' )">
<img src="link1.jpg" width="166" height="121" border="0" name="image1"></A></td>
<td><a href=".html" onmouseover="swapImage( 'image2' , 'link2on.jpg' )" onmouseout="swapImage( 'image2' , 'link2.jpg' )"><img src="link2.jpg" width="174" height="121" border="0" name="image2"></a></td>
</tr>
<tr>

<td><img src="indexwork43-2.jpg" width="51" height="159" border="0"></td>
<td><a href=".html" onmouseover="swapImage( 'image3' , 'link3on.jpg' )" onmouseout="swapImage( 'image3' , 'link3.jpg' )"><img src="link3.jpg" width="166" height="159" border="0" name="image3"></a></td>
<td><a href=".html" onmouseover="swapImage( 'image4' , 'link4on.jpg' )" onmouseout="swapImage( 'image4' , 'link4.jpg' )"><img src="link4.jpg" width="174" height="159" border="0" name="image4"></td>
</tr>
</table>
</div>

[nop86]

Thanks! That does solve the problem..but..
What happens now is, when I resize my window, the scroll bar for the iframe text box disappears. This seems to be because the scroll bar is sort of overlayed onto the image on the right of the iframe (looking back at the code, this is the cut-up images within the tables.) Is there anything I can do about this?
Is it necessary for me to even worry about this? (I do want the page to be visible to all browsers-which it is, and all window sizes...).
Thanks again!

[TheBigT]

Well do you need to scroll or no? It depends if it is overlapping then increase the size of the iframe some.

[cocopuffs]

um sorry I know I cannot help you but I have a little bit of trouble with my iframes as well... like I got everything set and on my website... I have an iframe for the main place everything goes and then I have another iframe where all my links are... would you happen to know the code for links so that when you click on them the page shows up on the main iframe? please if you can help me I would GREATLYYYY appreciate it!