Web pages not rendering correctly
I've noted more and more lately that FF does not display pages correctly. Here is another one I just ran up on:
Attached are screen shots of FF 59.0.2 [64 bit] and on Chrome Version 66.0.3359.139 (Official Build) (64-bit) running the OS Ubuntu 14.04.
Chrome appears to be rendered as intended, but the problems with FF are obvious. As far as I know, this is a browser related issue. What's going on here?
Okulungisiwe
All Replies (7)
Load the web page. Then, to reload the page bypassing the cache and force a fresh retrieval; Ctrl+Shift+R (Mac=Command+Shift+R)
Many site issues can be caused by corrupt cookies or cache.
- Clear the Cache and
- Remove Cookies
Warning ! ! This will log you out of sites you're logged in to. You may also lose any settings for that website.
- Cookies; Delete cookies to remove the information websites have stored on your computer {web link}
- Cache; How to clear the Firefox cache {web link}
If there is still a problem, Start Firefox in Safe Mode {web link} by holding down the <Shift> (Mac=Options) key, and then starting Firefox.
A small dialog should appear. Click Start In Safe Mode (not Refresh). Did this help?
While you are in safe mode;
Try disabling graphics hardware acceleration in Firefox. Since this feature was added to Firefox it has gradually improved but there are still a few glitches.
How to disable Hardware Acceleration {web link}
Hi jehurd, that label overlay is temporarily positioned at the top and then a script in the page pushes it down. I'm attaching a screenshot with scripts disabled (label at top) and enabled (script pushes the element down by moving it down 140 pixels).
I don't know why they do it that way, but for some reason, that function seems not to be working on your Firefox. Can you think of any reason that site's scripts could be blocked from running on your Firefox?
Actually, in your screenshot, the label overlay is moved down, but the rest of the layout is switching to the site's mobile layout (top menu items under a "3-bar" menu button) even though your page is wide enough to use deskop.
Does this happen on other sites, where it tries to use a mobile layout instead of desktop or mixes them up?
Hopefully FredMcD's suggestions will take care of you in that case.
Tried FredMcD suggestions with no change in behavior. As to jscher2000 comments, I am not sure about http://how2recycle.info/ being a mobile site. As stated above, I have had various websites do odd things like this and just went to Chrome to surf/use them. I have not kept track of these other sites and unsure if there are mobile. Thanks for the suggestions.
On Windows 10, I would suspect tablet or touchscreen issues, but I don't know whether that is applicable to your device.
Does it make any difference if you adjust the zoom level on the page (e.g., hold down Ctrl and tap the + key a couple times, or the - key a couple times)?
Have you made any changes to the font sizes through the Preferences page? In particular, setting a minimum font size can break website layouts, although I'm not sure if that's a factor in this case.
Ahah! Going to a 90% screen renders the page correctly, anything above that breaks the rendering. Not sure what the scripts have to do with it. I would think the "normal" 100% view should render correctly, but obviously it does not.
Aha!
Many websites use a "responsive" template that keys off of your reported screen resolution or tab "viewport" width. Firefox varies the reported resolution depending on the zoom level. If you have a display in the 1280 - 1366 - 1400 pixel width range, you may be near a boundary between desktop and tablet layout for different sites depending on your zoom level.
To look at how pages see your resolution at different zoom levels, you can have a play here:
https://www.jeffersonscher.com/res/resolution.php
If you check the same page in Chrome, you'll see some of the numbers differ from Firefox, and if the sites never test in Firefox, well...