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.

Avatar for Username

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

This thread was archived. Please ask a new question if you need help.

Iframe in firefox loads css before js and breaks styling

  • 1 reply
  • 1 has this problem
  • 1 view
  • Last reply by cor-el

Lavey
Lavey
more options

A site with an iframe loads ok in Chrome, but when it comes into Firefox, it uses javascript to replace the select/option with ul/li, so when the replacement is done, the css is already loaded and the page doesn't show the styling properly (transparent div that contains the ul/li/a array).

If you right-click the iframe and go to ThisFrame dialog and click ReloadFrame, you will be able to see the proper style now. If you open the iframe in a new window the styling works ok.

I did some testing myself and checked some info on bugs that Firefox may have but I just found this: https://support.mozilla.org/fr/questions/970521

And a mention about http/https calls, but this appear to not be the case. I know there's also a problem when the iframe is hidden and then it's shown, but I'm not sure this is happening because in the other documented cases, the iframe shows nothing at all (Iframes in firefox not updating when hidden).

Any help, whether it be which is the real problem or which could be the solution would be really appreciated.

The site is: http://www.odenresor.se/boka-direkt/nyahyrbil/

A site with an iframe loads ok in Chrome, but when it comes into Firefox, it uses javascript to replace the select/option with ul/li, so when the replacement is done, the css is already loaded and the page doesn't show the styling properly (transparent div that contains the ul/li/a array). If you right-click the iframe and go to ThisFrame dialog and click ReloadFrame, you will be able to see the proper style now. If you open the iframe in a new window the styling works ok. I did some testing myself and checked some info on bugs that Firefox may have but I just found this: https://support.mozilla.org/fr/questions/970521 And a mention about http/https calls, but this appear to not be the case. I know there's also a problem when the iframe is hidden and then it's shown, but I'm not sure this is happening because in the other documented cases, the iframe shows nothing at all (Iframes in firefox not updating when hidden). Any help, whether it be which is the real problem or which could be the solution would be really appreciated. The site is: http://www.odenresor.se/boka-direkt/nyahyrbil/

All Replies (1)

cor-el
cor-el
  • Moderator
  • Top 10 Contributor
more options

I'm not seeing difference between loading that page and opening the frame in a new tab.

Can you attach a screenshot?

  • Use a compressed image type like PNG or JPG to save the screenshot
  • Make sure that you do not exceed the maximum size of 1 MB

You can try these steps in case of issues with web pages:

You can reload web page(s) and bypass the cache to refresh possibly outdated or corrupted files.

  • Hold down the Shift key and left-click the Reload button
  • Press "Ctrl + F5" or press "Ctrl + Shift + R" (Windows,Linux)
  • Press "Command + Shift + R" (Mac)

Clear the Cache and remove the Cookies from websites that cause problems.

"Clear the Cache":

  • Firefox/Tools > Options > Advanced > Network > Cached Web Content: "Clear Now"

"Remove the Cookies" from websites that cause problems.

  • Firefox/Tools > Options > Privacy > "Use custom settings for history" > Cookies: "Show Cookies"

Start Firefox in Safe Mode to check if one of the extensions (3-bar Menu button/Tools > Add-ons > Extensions) or if hardware acceleration is causing the problem.

  • Switch to the DEFAULT theme: 3-bar Menu button/Tools > Add-ons > Appearance
  • Do NOT click the "Refresh Firefox" button on the Safe Mode start window