Join the AMA (Ask Me Anything) with the Firefox leadership team to celebrate Firefox 20th anniversary and discuss Firefox’s future on Mozilla Connect. Mark your calendar on Thursday, November 14, 18:00 - 20:00 UTC!

This site will have limited functionality while we undergo maintenance to improve your experience. If an article doesn't solve your issue and you want to ask a question, we have our support community waiting to help you at @FirefoxSupport on Twitter and/r/firefox on Reddit.

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

iFrame Text Problem?

more options

Hi,

I have some local files (HTM pages) that I access through the FireFox browser. These pages have a collection of links. Some of these are within [iFrame] /iFrame markups. The ones that link to URL images work fine. The problem I have is any iFrame I have that link to a text (URL) looks like it is not working. The box 'appears' blank (the same background color as the page).

However, when I click and highlight inside the iFrame, the text indeed is there. How do I get the text to appear in these iFrame boxes? (I tried it with [Embed], same problem.)

- Pj
Hi, I have some local files (HTM pages) that I access through the FireFox browser. These pages have a collection of links. Some of these are within [iFrame] [/iFrame] markups. The ones that link to URL images work fine. The problem I have is any iFrame I have that link to a text (URL) looks like it is not working. The box 'appears' blank (the same background color as the page). However, when I click and highlight inside the iFrame, the text indeed is there. How do I get the text to appear in these iFrame boxes? (I tried it with [Embed], same problem.) - Pj

Chosen solution

Firefox uses a transparent background on iframes by default. Apparently a plain text document does not invert properly in that scenario. Not sure if this is a bug or whether there is no applicable standard and IE is just more helpful.

I suggest using a style rule to change the background color of iframes. If the page in the frame (HTML page) sets its own background color, that will take precedence.

Here's a "Fiddle" that gives an example: http://jsfiddle.net/KV9Ct/

Read this answer in context 👍 0

All Replies (11)

more options

If you right-click the document in the iframe > This Frame > Open in a New Tab, does the document appear normally there, or does it have the same problem?

more options

I do the same thing, but I use a DOCX file to store the information. When I load it into my Microsoft Word Starter program, I can edit, copy, or even have the link opened from the editor.

more options

"Open Frame in New Tab" works just fine, just like if I would go directly there normally. It's a text of the local forecast, black text on white background.

It worked just fine when I using IE8/9 for years.

I noticed this when just recently switched to FF for the first time with v27 and now this v29.0.1.

I call up this off-line page I made by clicking the 'Home' button which brings up a home-made 'Home Page' I made with all my favorite/frequent links.

Is this a FireFox bugaboo?

- Pj
more options

Is the color scheme of your main page also black-on-white? In that case, I would expect it to display normally.

Could you post the iframe tag? Omit the opening and closing angle brackets to avoid the forum trying to embed a file.

more options

Do these links point to files on the internet or to local files on your computer?

more options

(iFrame

Src="http://weather.noaa.gov/pub/data/forecasts/zone/oh/ohz011.txt"
Width="600"
Height="800"
Scrolling="No"
Alt="CUYAHOGA County Zone Forecast - CLE NWS")

(/iFrame)

(Cor-el, the links are nearly 100% pointing to images/pages/text from the Internet. Weather maps - Radar, Satellite images, etc.)

Well, well. I changed the background color from BLACK to a dark Green and the (black) text shows up. I did not have to account for this with IE, as it properly showed the text forecast page with its white background.

Why FF is not doing this, I do not know.

I just tried another forecast link, but it is an HTML page, and it shows up fine. I really wish I can get that text-link page to work right without having my whole page's background color changed from black.

Anyway to get this to work?

-Pj
more options

My "Home Links Page" does have a number of links to local files (pages) and work just fine.

One of these local pages contains my local collection of weather images and text. Some of these are 'housed' in an iFrame, including the problematical text forecast with the background color 'problem'.

-Pj
more options

To Sum this up:

I did not have to account for this with IE, as it properly showed the text forecast page with its white background.

Why is FireFox not doing this?

more options

Chosen Solution

Firefox uses a transparent background on iframes by default. Apparently a plain text document does not invert properly in that scenario. Not sure if this is a bug or whether there is no applicable standard and IE is just more helpful.

I suggest using a style rule to change the background color of iframes. If the page in the frame (HTML page) sets its own background color, that will take precedence.

Here's a "Fiddle" that gives an example: http://jsfiddle.net/KV9Ct/

more options

Hi jscher2000! Thanks! That works. (I say it is either a bug or design oversight.)  ;) -&=:

Nifty 'JSfiddle' site. I need to learn more of that CSS stuff.

Is there a way to Center or Left/Right justify in iFrames? I did find anything on my initial search just yet.

more options

There's something of a security barrier between the main page and the framed page, especially when they are on different sites. So... while you could center the frame in the page --

I suggest putting the frame in the middle of the following to center it horizontally on the page:

<div style="text-align:center">your frame here</div>

-- the style rules on the page can't reach into the page inside that frame. Or at least I did not find a way to do it when I was experimenting.

If you want to apply style rules to sites, you can either use the Stylish extension or create/edit a userContent.css file. It's probably beyond the scope of this question to go into much detail on that, but that is what I would try.