<iframe> height to fit its content?

How do i set the height of an <iframe> so that the growing content fits?

[dj_jam]

I currently display the Forum of my website <sorry, no specifics> by using an <iframe>. However, i have not found any way to automatically set the height of this <iframe> to always fit its content (the height required to fit messages of my forum needs to be dynamic).

For now, i just set a huge value for the height to make sure that the content will always fit (if not, an ugly scrollbar would appear) : <iframe src="http://example.com/gb.cgi?gid=553378&prot=prhnfk" width="100%" height="4000"></iframe>

I tried in vain 100% and other things...

Does anybody know how i could set the height dynamically to fit everything right every time?

Thanks,

JAM

[edited by: tedster at 4:04 am (utc) on April 14, 2003]
[edit reason] remove sig file [/edit]

[ShawnR]

Welcome to WebmasterWorld!

I don't think you can do it (at least I don't see an easy way). Using a percentage makes it a percentage of what contains it, not a percentage of its contents.

You could try play around with using Javascript to do something like a word count of your contents, then manipulate the height attribute through the DOM.

If you don't want the scrolling, why use an iframe?

Shawn

[dj_jam]

Well, the issue is that this scenario appears in many places of my website. I use iframes to display pages in the main web frameset (feel free to take a look at the site and you will see that the layout has many constraints).

I think that i need a javascript that would be able to compute the height of the table displayed in an <iframe> and use this dynamic value as the height in the <iframe> tag.

Something like :
<iframe src="page.html width="100%" height="(height of main table in page.html)"></iframe>

I would really appreciate the help of an expert here.
Thanks,

JAM

[edited by: tedster at 3:30 am (utc) on April 14, 2003]
[edit reason] sig file [/edit]

[dj_jam]

HINT : the height that i set manually for my iframes is always directly related to the height of the main table contained by the iframe.

JAM

[edited by: tedster at 4:14 am (utc) on April 14, 2003]

[tedster]

When I try to approach this, I come against a big issue. Even when javascript can measure the height of a screen object, that object must first be rendered. But you need to give the height of the iframe before the document is loaded into the frame.

Especially because text is involved here, the height of the containing table isn't determined before it's rendered. Even if the HTML gives the table a height attribute, browers only take that as a "suggestion." Browsers are allowed to overrule the table's height attribute if they need to in order to render all the content. There are many threads here where people struggle with this issue - table width and height attribute can be, and regularly ARE, changed by user agents.

So I can't see how you could get the needed height before the document is rendered, and it isn't rendered before the iframe is set up. It's a catch-22.

[ShawnR]

I agree with Ted that you won't know the exact height of the text, but you could go for a 'near enough' solution (Could even define the text size in pixels instead of points...). I don't think the catch-22 part of the problem is that big a deal.

What I meant by my previous post was to just render the page, then use the onload() method (which only fires after the document has been rendered) to calculate the required height, and then change it by accessing its height attrib through the DOM.

Shawn

[dj_jam]

Thank you to everybody for the suggestiions.
I will do more research and try to put together something to resolve this problem.

-- the quality of this forum is excellent.

JAM

[AWildman]

I'm doing exactly the same thing. I managed to get it to work through much javascript doing just about what was described in the previous posts.
It works well. I load the iframe container page, do an onload on the iframe's content page and then calculate the various heights that I need.
HOWEVER: IE 5 on the Mac will give you problems if you go from a page in the iframe that is short, to much longer content, and then to shorter content. The body refuses to shrink to fit the shorter material after the longer material has been viewed.
I used a table in the iframe container page and resized the table to exactly match the content of the iframe. The body extra body space STILL won't go away. I'm leaving it for now since it does no harm. A scrollbar appears.

[SLoBBer]

lo

just an idea ;)

what about getting the screen resolution height and setting the iframe height to suit?
If the amount of text wernt an issue but the look of the height on the screen was, then this would work ok?