Webpage content becomes unreadable at certain zoom levels
Hi,
for some reasons yet unknown to me firefox adds horizontal lines over some content of a webpage when the whole page is zoomed in or out to certain levels, namely zoom levels 67%, 90%, 110% and 133% are affected. All the other zoom levels show all content correctly. Issue exists in two recent versions 79.0 and 80.0. The issue does not exist in other mainstream web browsers on the same machine at any zoom levels. Firefox is also the only browser that i tested that displays horizontal ruler on one webpage at 100% browser zoom. this ruler moves only very slightly, but it is still there. Why?
Most of the webpages can be zoomed and viewed without problems, but some areas are bad. I am not owner of the affected web pages nor cannot i access its source code to tell what functions are used in these areas, but somehow the issue seems to be ONLY with firefox latest versions.
Can you think of anything that has been changed lately that could cause such an odd behavior of zoom?
added image to explain the issue better.
Awaiting for replies, tavikas
All Replies (6)
PS! when switching between zoom levels it seems as the aspect ratio changes back and forth over every two level. even the top left corner jumps in its position left-right-left.. What can i do?
Hi
Are you possibly using zoom text only because using full page zoom shouldn't have such effects ?
Hi tavikas, it looks like text from this page:
https://t4.answers.travian.com/?view=answers&action=answer&aid=266#go2answer
That whole central column has a repeating background of a 5-pixel tall white line:
https://t4.answers.travian.com/templates/travian4/img/wrap_bg.png
The lines should stack immediately adjacent and never have any gaps, so the image behind should never show through.
I think somehow gaps are occurring at the various zoom steps, but I don't know what could cause that.
(It actually sounds vaguely familiar from a thread long ago, but I doubt I could find it now...)
If you haven't already, could you test in Firefox's Safe Mode? In its Safe Mode, Firefox temporarily deactivates extensions, hardware acceleration, any userChrome.css/userContent.css files, and some other advanced features to help you assess whether these are causing the problem.
If Firefox is not running: Hold down the Shift key when starting Firefox. (On Mac, hold down the option/alt key instead of the Shift key.)
If Firefox is running: You can restart Firefox in Safe Mode using either:
- "3-bar" menu button > "?" Help button > Restart with Add-ons Disabled
- (menu bar) Help menu > Restart with Add-ons Disabled
and OK the restart.
Both scenarios: A small dialog should appear. Click "Start in Safe Mode" (not Refresh).
Any improvement?
@cor-el: i am using full zoom from customization menu.
@jscher2000: your answer is incredible accurate. the screenshot was indeed from travian page. In safe mode the horizontal lines do not appear in front and the text is all well visible. - improvement The horizontal scroll bar is however still present - no change.
So what can i do to pinpoint the conflicting items further?
You can try to disable hardware acceleration in Firefox.
- Options/Preferences -> General: Performance
remove checkmark: [ ] "Use recommended performance settings"
remove checkmark: [ ] "Use hardware acceleration when available" - https://support.mozilla.org/en-US/kb/performance-settings
Close and restart Firefox after modifying the setting for changes to take effect.
You can check if there is an update for your graphics display driver and check for hardware acceleration related issues.
Removing both performance checkmarks and restarting with add-ons enabled also fix the issue.
No driver updates are available. Tried various options in AMD Radeon Settings, but failed to make it work with hardware acceleration selected in performance section. a selection of options i tried to change and their initial values: Anti-aliasing Mode: use application settings Filtering mode: use application settings GPU scaling: off