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

How to fix images loading too big and going off of the page?

  • 12 replies
  • 1 has this problem
  • 180 views
  • Paskiausią atsakymą parašė Holyroller

more options

So a couple of days ago I started having this issue with one specific site where images are loading all the way off the screen. This is mainly in forum posts. It only happens in firefox and it only happens on this one website which by the way is a guild website I use for a game called RIFT. I don't have the same problem with in Internet Explorer or Chrome so I know the issue either lies with firefox and or the website itself. The website is www.valkyriandescent.com in case anyone would like to see if they have the same issues. I already know from asking the people I game with that it loads in fine for some of them and other have the same issue I do. I'm going to post a screenshot below to show what i'm talking about. Any help would be greatly appreciated as this is really annoying me as I use the site a lot.

So a couple of days ago I started having this issue with one specific site where images are loading all the way off the screen. This is mainly in forum posts. It only happens in firefox and it only happens on this one website which by the way is a guild website I use for a game called RIFT. I don't have the same problem with in Internet Explorer or Chrome so I know the issue either lies with firefox and or the website itself. The website is www.valkyriandescent.com in case anyone would like to see if they have the same issues. I already know from asking the people I game with that it loads in fine for some of them and other have the same issue I do. I'm going to post a screenshot below to show what i'm talking about. Any help would be greatly appreciated as this is really annoying me as I use the site a lot.

Chosen solution

Thank you for all of the suggestions and help. I really appreciate it. I finally received an email from enjin earlier tonight and they have fixed the problem themselves. :)

Skaityti atsakymą kartu su kontekstu 👍 0

All Replies (12)

more options

Image wouldn't upload in the original post so here it is. http://i296.photobucket.com/albums/mm168/Holyrollerx12/Too%20Big_zpsu18iztka.png

Modified by Holyroller

more options

I think a login might be required to see attachments on the site.

Assuming the site was designed to shrink the image to fit within the width of the column, that isn't working in Firefox. Are they aware of the issue?

If you are left to your own devices, you can investigate by right-clicking the oversized image and choosing Inspect Element (Q). Firefox should open a panel in the lower part of the tab showing the HTML of the page where that image is located and on the right side, the style rules that apply to that image. If you've never seen this before, don't panic, just let your eyes adjust for a few moments.

On the left side, the image will be contained within a parent element, and it will have a parent element, as you move from the most indented level up and left. As you select or hover over them, a light blue selection mask should appear on the screen. When the selection resizes to the proper width, you know the problem is at or below that level: some style rule is failing in there.

Unfortunately, it is very difficult to capture all the relevant information about that portion of the page to share with us. (It's easy to copy the HTML code by right-clicking that element and choosing Copy Outer HTML but this doesn't include the applicable style rules for all of its contents.) Someone might need to get a login to look at it more closely.

If it turns out not to be a Firefox bug but a feature (i.e., this is what the web standards say should happen) and the site can't work around it, then it's usually possible to "hack" a page by applying custom style rules to it. Again, though, it's hard to us to prescribe the right hack without hands-on access.

more options

If other Firefox users are getting mixed results, maybe differences in add-ons are a factor?

In case one of your extensions is involved, could you test the page in Firefox's Safe Mode? That's a standard diagnostic tool to deactivate extensions and some advanced features of Firefox. More info: Diagnose Firefox issues using Troubleshoot Mode.

You can restart Firefox in Safe Mode using either:

  • "3-bar" menu button > "?" button > Restart with Add-ons Disabled
  • Help menu > Restart with Add-ons Disabled

Not all add-ons are disabled: Flash and other plugins still run

After Firefox shuts down, a small dialog should appear. Click "Start in Safe Mode" (not Reset).

Any difference?

more options

jscher2000 said

If other Firefox users are getting mixed results, maybe differences in add-ons are a factor? In case one of your extensions is involved, could you test the page in Firefox's Safe Mode? That's a standard diagnostic tool to deactivate extensions and some advanced features of Firefox. More info: Diagnose Firefox issues using Troubleshoot Mode. You can restart Firefox in Safe Mode using either:
  • "3-bar" menu button > "?" button > Restart with Add-ons Disabled
  • Help menu > Restart with Add-ons Disabled
Not all add-ons are disabled: Flash and other plugins still run After Firefox shuts down, a small dialog should appear. Click "Start in Safe Mode" (not Reset). Any difference?


No difference. I still get the same thing. I did however notice while trying to upload the image in my second reply by inserting the image into the post itself that I was getting the same issue here on the support page. It loads all the way off the screen the same way it does on the valkyriandescent site.

Modified by Holyroller

more options

Regarding inline images in posts on this forum, that's right, there is no size control on those whatsoever, they just display at their full "natural" width and height (or possibly even larger if you're using zoom).

more options

You can consider to set a maximum width to images on that website with code in userContent.css like in this thread

Add code to the userContent.css file.


@-moz-document domain(<domain_of_website>) {
 img { max-width: 1024px !important; height: auto !important; }
}

The customization files userChrome.css (user interface) and userContent.css (websites) are located in the chrome folder in the Firefox profile folder.


See also:

more options

jscher2000 said

I think a login might be required to see attachments on the site. Assuming the site was designed to shrink the image to fit within the width of the column, that isn't working in Firefox. Are they aware of the issue

I don't think they're aware. I tried to post on their support forum, but didn't really get the kind of response I was looking for so I just sent in an actual support ticket right now. I'll update with my next reply as to what their answer is and or if they have a fix of their own.

more options

So I only got an email from enjin saying they're investigating the problem and would get back to me soon, but in the meantime a friend of mine posted this (which you will see in the screenshot) and it actually fixed the issue by changing Max- Width to just "Width, but the only problem is it only worked for the one image I tried it on so it's not a permanent fix which is what I need. I'm not familiar at all with changing css code.

http://s296.photobucket.com/user/Holyrollerx12/media/FIX_zps7rxmkkwy.png.html

more options

Hey jscher, I registered an account for you on the site and found the poster's thread. I'll PM you the login and you can check it out whenever. :)

http://www.valkyriandescent.com/forum/m/1246912/viewthread/20457531-firefox-issues

Modified by NoahSUMO

more options

Might help if I just give you guys access to the rest of the forums :P Done and done!

more options

This is a problem with the fieldset tag not behaving like a normal block element. If I use the Inspector to edit the fieldset tag to a div, everything snaps into place. (See screen shots.) I don't know whether this is standards-compliance by Firefox or a bug, but a quick workaround would be to change that if it doesn't break other desired functionality. (Most sites use the fieldset tag only for styling and not for behavior, but the scripts need to be checked just in case.)

more options

Chosen Solution

Thank you for all of the suggestions and help. I really appreciate it. I finally received an email from enjin earlier tonight and they have fixed the problem themselves. :)