I would like to have an IFRAME dynamically sized using the following CSS:
#myiframe {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
However, no browser seems to support this.
In good browsers I could wrap the IFRAME in a DIV with the quoted CSS style and set the height & width of the IFRAME to 100%.
This does not work in IE7.
Short of using CSS expressions, has anyone managed to solve this?
Update
MatTheCat answered with a scenario that works if the IFRAME is located directly under the body and the body/html tags have height: 100% set. In my original question I did not state where the IFRAME was and what styling applied to it's container. Hopefully the following addresses this:
<html>
<body>
<div id="container"><iframe id="myiframe"></iframe></div>
</body>
</html>
and let's assume the following container CSS:
#container {
position: absolute;
top: 10px;
bottom: 10px;
left: 10px;
right: 10px;
}
if you now place height: 100% on the IFRAME it will not size correctly.