iframe breaking parent element size - html

Question

I have a page with a menu which is used to generate a table out of MySQL query which fields are selected in the menu. I needed the "Refresh table button" to generate the table only in part of the screen and in terms of functionality the iframe did its job. When I focused on the view, however, I started having problems with the frame. Although it seems bounded on the left and top, on the right and bottom it exceeds the size of the parent frame div and the body div.
Is there anyway to deal with this without changing the functionality?
HTML
<div class="menucontainer">
<div class="leftbox">
Selected options
<form method="post" action="genTable.php" target="myIframe">
<select id="leftValues" name="cols[ ]" size="5" multiple>
<option>paper</option>
<option>authors</option>
</select>
<div class="submitbutton">
<input type="submit" name="submit" value="Refresh Table" onclick="selectAll();">
</div>
</form>
</div>
<div class="buttons">
<input type="button" id="btnLeft" value="<<" />
<input type="button" id="btnRight" value=">>" />
</div>
<div class="rightbox">
Available options
<select id="rightValues" size="5" multiple>
<option>id</option>
<option>journal</option>
<option>title</option>
</select>
</div>
</div>
<h1>Financial Frictions Papers</h1>
</div>
<iframe name="myIframe">
</iframe>
</div>
</body>
CSS
body {
font-family: Helvetica, Arial, Verdana, sans-serif;
color: #111;
font-size: 12px;
background:#2e2e2e;
height: 100%;
/*292929*/
/* default bfbfbf*/
}
.frame {
padding: 20px;
color: #000000;
height: 100%;
min-height: 580px;
background: #3AAB8D;/*#504f4f;*/
}
.top {
background: #1188FF;
}
iframe{
position: absolute;
width: 100%;
height: 100%;
}

Answer 1

You're positioning the iframe absolutely and then giving it a width of 100%, which means it's going to be as wide as the entire page, not the div the tag occurs in because it isn't really 'in' the div.
Try either reducing the width or not making the iframe absolutely positioned.
When I edit your CSS in Firefox, removing the absolute positioning and changing the width to 99.8% (to accomodate the scrollbar) worked.