Help with iframe Resizing
I am in the frustrated position of trying to create a re-sized height of an iframe sandwiched in between fixed dimension areas. :confused:
Please see the image @ http://www.bcw.se/image_resources/iframe_help_01.png for reference of the goal and current state of my mission. I also pasted in the code that I used to create it below. As you can see the iframe is not expanding beyond a set standard I presume.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<body style="width:1024px; height:100%; line-height:175%; margin:auto; font-family:Verdana, Geneva, sans-serif; font-size:13px; background:#003; color:#CCC;">
<!-- Header Area --><table width="100%" height="125" bgcolor="#003366" style="margin-top:0px; border-collapse:collapse;"></table>
<!-- Menu Area --><table width="100%" height="30" bgcolor="#006699" style="margin-top:10px; border-collapse:collapse;"></table>
<!-- Framed Content, FLEXIBLE RESIZED TO FIT THE SCREEN... I WISH!! --><table width="1024" height="100%" bgcolor="#003366" style="border-collapse:collapse;">
<div style="margin-left:10px; margin-top:10px; position:relative;">
<iframe src="http://www.ikea.se" width="1002" height="100%" scrolling="yes" style="border-radius: 0.3em 0.3em 0.3em 0.3em; border-collapse:collapse; position:relative;" ></iframe>
<!-- Footer Area --><table height="50px" width="1024" bgcolor="#006699" style="margin-top:10px;"></table>
Obviously the iframed content is en example page, so I am not looking to have an IKEA web page iframed, but I am wanting to have another complete webpage iframed and have the scrollbar only within the iframe area.
As my handle suggests I am a novice developer playing for my own interest and benefit, so feel free to talk simply and down to me. All highly technical responses will likely give me a bloody nose. ;)
At any rate, thanks in advance!
Still running into troubles
Thanks for your reply! I cannot get the result though.
The iframe resizes to 100% of the screens resolution perfectly fine, but there in lies the problem. It resizes to the entire screens height dimension and not to the remaining height dimension.
So the iframe runs off the screen and under or over the footer area depending upon if the footer's position is fixed or not.
I continue my quest, thanks again though!
Next stop: Idiot-ville. Population: me!
God I am an idiot.... I see what you did, you divided the entire document heights from 100%.
Unfortuntely that won't do me because the header, menu and footer have set graphic elements, darn it all.
So close there...:o