homepage Welcome to WebmasterWorld Guest from 54.204.94.228
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Browsers / Firefox Browser Usage and Support
Forum Library, Charter, Moderators: incrediBILL

Firefox Browser Usage and Support Forum

    
Fluid width iframes in Firefox and IE
One or the other?
katana_one




msg:1589558
 8:53 pm on May 3, 2005 (gmt 0)

It seems I am having trouble with an iframe's width displaying differently in IE and Firefox.
Currently, it is set to width="100%" which works fine in IE, which most of our visitors use. But Firefox does not seem to like the 100% value, and only renders an iframe about 200-300 px wide instead of using the container DIV's width.

If I change the iframe width to "auto" then it displays correctly in Firefox, and in IE it fails to use the parent DIV's width.

How do I get it to display at 100% of the parent DIV's width in both browsers?

 

jo1ene




msg:1589559
 10:00 pm on May 3, 2005 (gmt 0)

Do you have FF's web developer tools (Google it). There is a choice within that outlines block elements. I find it helpful in these cases. Maybe if you posted the code someone could help you spot the problem. I am working on an iframe and it's displaying the same in both browsers so I think your problem is elsewhere.

stlwebs




msg:1589560
 1:19 am on May 4, 2005 (gmt 0)

It seems I am having trouble with an iframe's width displaying differently in IE and Firefox.
Currently, it is set to width="100%" which works fine in IE, which most of our visitors use. But Firefox does not seem to like the 100% value, and only renders an iframe about 200-300 px wide instead of using the container DIV's width.

If I change the iframe width to "auto" then it displays correctly in Firefox, and in IE it fails to use the parent DIV's width.

How do I get it to display at 100% of the parent DIV's width in both browsers?

First of all, when I build anything for the web I always preview it in Firefox because if it dispays right there, you pretty much assume it will be good everywhere else.

For your iframe problem, since you are placing iframes within tables and layers/div's, I would check your code for the div or table that you are specifying the iframe to take up 100% of the width.

katana_one




msg:1589561
 12:23 pm on May 4, 2005 (gmt 0)

The code is not that complicated, but I'll go ahead and post it anyway.
Here is the relevant HTML:

<div id="store">
<iframe name="content_frame" width="100%" height="500" frameborder=0 src="someURL"></iframe>
</div>

In the CSS I currently have:

#store {
position: absolute;
top: 165px; left: 0;
padding: 0 65px 0 65px;
width:100%;
}

This displays fine in IE, but in Firefox the iframe does not fill the DIV. If I change the width to "auto" then the iframe does not fill the DIV in IE.

[edited by: katana_one at 12:51 pm (utc) on May 4, 2005]

katana_one




msg:1589562
 12:31 pm on May 4, 2005 (gmt 0)

I always preview it in Firefox because if it dispays right there, you pretty much assume it will be good everywhere else.

Obviously, if that were true, I would not be posting this question, now would I?

katana_one




msg:1589563
 12:27 pm on May 5, 2005 (gmt 0)

<bump!>

ricfink




msg:1589564
 12:28 am on May 6, 2005 (gmt 0)

Made a test page, unable to replicate.

Iframe is filling up in both.

Quirks or standards? (What's the doctype.)

Do you have a width set on body?

katana_one




msg:1589565
 12:07 pm on May 6, 2005 (gmt 0)

No width set on body, and the DTD is 4.01 Transitional.

katana_one




msg:1589566
 1:09 pm on May 6, 2005 (gmt 0)

Incidentally, Netscape 7x, Opera 7x and IE 6x all display the page the way I originally intended.
I have removed the width reference in the CSS - this was actually how I had it before I began trying to 'fix' it in FF (I originally tested in Opera, IE and NN - I only downloaded FF recently).

I can live with it for now.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Browsers / Firefox Browser Usage and Support
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved