Reader Help: Firefox Horizontal Line Bug
Published on March 9, 2007 in Firefox, GeneralWith the new design of this site I have gotten a few reports from Mozilla Firefox users of an annoying black or gray 1px thin horizontal line(s) that displays on the screen after the page has been scrolled up or down (Two examples of this behavior appear at the bottom of this post). These lines appear to occur where the bottom line of a div or iframe is. The problem is that they are not showing up for me and thus I am having a hard time figuring out what the issue is. I believe that this is a bug with Firefox that has been mentioned several times including here.
These lines are appearing in the top of the page above the fold and appear even if a clean Mozilla profile is used. It looks like it may be related to the Google ad in the right-hand corner of the screen (I have removed the ad temporarily). Google’s AdSense works by using JavaScript to generate an iframe in which to dynamically serve advertisements. I am using style overflow: auto to help position the div blocks on the page. If you have any ideas of what the problem may be and how to fix it or you are still experiencing issues with the lines on the page please let me know.
Im wondering, because i have never seen an bug like this before. My firefox 2.0.0.2 is showing your site excellent.
Great new Design and work.
Thanks for the nice words. I have tried several different computers but have not been able to create the bug either. I am convinced though it has something to do with iframes and Adsense.
You can see a sample of the bug in the wild at http://www.larryeubank.com/cheetah/cheetah_MenuFrames.html. Scroll down to the bottom of the page.
I am having a massive problem with these lines in Firefox – all over my screen, whenever anything is scrolled, moused-over, or typed! I’ve searched for fixes, or whatever, with no success. I’ll check this post for updates but would be very grateful for any insight!
TC…Do you have a sample of your site on the page that I can look at to see if I can offer any suggestions?
Yes I can confirm the lines are on ads only and in Firefox only such as my site http://www.futuremovies.co.uk I will post back if I fix it but some one must know how?
Found a fix… enclose your adsense in these two divs where position:absolute is criticle…
AdSense Code
Sorry, it’s not my site that is the problem – I get lines in Firefox for all sites I visit. I assume mine is some hardware/Firefox compatibility problem.
I have the same problem… horizontal lines everywhere, does anybody have a solution?
TC,
The problem seems to be a site and browser problem. For example, on two of my computers I get the lines on my site and on one I do not. Yet I can make the lines go away by changing how I am clearing floats. It also appears to be impacted by the speed of which you scroll on the page.
Jose,
Are you having a problem with the code on your site or when viewing pages? The idea Johan suggested seems to work in most cases.
No, I’m having this problem with every page i visit, even this.
In here you can see an screenshot (http://jmserver.org/screenshot.JPG) of this page with the horizontal lines, i tried to install 1.5.0.11 but with the same results.
These lines comes when I scroll down the page, or when i drag any other window over it.
Please help me.
Jose,
I am not having the issue on all sites. Try this, to see if it is something with your configuration or setup. Download the portable version of Firefox and load it somewhere on your PC. This will not cause any problems with your current version and will give a clean fresh install of Firefox 2. See if you still get the lines everywhere.
Lesliefranke,
Thank you for your response, but even with that version (portable) i get the same annoying lines, i think it’s a rendering problem with my Motherboard (Intel DG965SS) and my Video Card (GeForce FX 7300 GS). If anybody has the same problem please help me! i’m searching for a solution 2 months ago, but no luck yet.
There is a bug report open on this at Bugzilla. How are you clearing floats differently to work around this bug?
Hello, I am using Firefox 2.0.0.4 and I am not getting any error. I love your site.
this works fine with firefox but internet explorer doesnt on my pc
strange
thanks
I am getting the same problem with my website – Black horizontal lines all over the page. This only occurs in firefox.
This might not be the entire solution and the actual cause might vary, however: Have a look at any relative positioned divs on your page. If you have a div with an ID that is actually a class you will get grey lines on scroll. For example:
div.example {position: relative; height: 20px; width: 100px; top: 10px; left: 10px;}
Let’s say we have another div that is actually a class that holds the above.
Test
example is a class not an ID. Change the class to an ID and the problem will go away. (div#example)
This is bug 361768. Vote for it at https://bugzilla.mozilla.org/show_bug.cgi?id=361768 if you want to get it fixed.
hm… i tried, but it doesn’t work ?
These lines are driving me crazy! All sites are affected, only in Firefox. I am running an NVidia 6200 Turbocache. Nobody seems to be able to fix this problem.
Firefox 2.0.0.5
Just in case anyone has had an issue since, I fixed an issue on one of my sites by removing
overflow: auto
from the parent element in which my grey lines were confined.This probably won’t work for all, but it’s what caused my issues.
I have the same problem with both Firefox and Thunderbird, everything becomes garbled with horizontal lines when scrolling, when typing or when I move the mouse.
Neither Opera or IE are affected by this bug.
My motherboard is an Intel DG965 and my video card is an NVIDIA 7300GS
I fixed this issue by removing
line-height: 110%;
from the element which contained the div with the grey lines.Just changed the video card from a 7300GS to a 8600GT and I got the same error, horizontal lines on Firefox and Thunderbird…
It seems that this conflict is also interfering with some games, I just tried to play GTA and it froze.
BTW, i had this problem for a week (horizontal black lines across the screen when scrolling downwards) and realised the solution: disable my on-board sound card! Sounds crazy I know, but thats what it turned out to be.
Thanks for this article i`m search many weeks,but now i found this information here.
Thanks for help!
Peter
Thanks Mike! I seems that’s the solution! It’s been 3 days without lines! by the way, I thought that changing my video card would solve the problem, but it didn’t, (I upgraded from 7300 GS to 8500 GT), the problem is the Main Board, I recommend not to buy Intel 965 series, or at least DG965SS. Thanks to all!
Theses lines really annoying me I tried so many ways to avoid theme but no result !
I’ll download the portable version of firefox right now , hope it’s working fine.
I use nVidia 7300 XFX .
guys , did anyone tried to log on to the save mode and check it out ?
Hey Aziz, the safe mode gives the same result, try disabling the integrated audio card in BIOS settings, this worked for me (for shure, it’s been 3 weeks now without lines), the portable version also gets this problem.
I concluded it’s something with Intel 965 chipset and nvidia cards. I searched the internet for months and no one gives the right answer.
Thanks again to Mike(you rule!).
I tried Mike Parker’s recommendation from October 3, 2007, disabling the on-board sound card. That fixed my problem.
I turned off the on-board video and the problem is solved too.
Intel DP965LT MOBO, Intel E6300 DC2
I meant audio, not video.
Hello Jose Gallegos , OMG! I did your method and the problem GONE ! I don’t know what to say I’m really speechless . I’m writing now from Firefox again , you just made my day … many many thanks .
marry xmas for all
regards ,
Aziz
It’s definitely an audio card issue – the horizontal lines started appearing only after I installed a Creative Labs X-Fi card onto a machine that already has integrated audio yesterday. I suspect Jose’s solution (turning off the integrated audio in BIOS) will solve the problem. Thanks, everybody! (and Google search)
I have an Asus A8N-SLI Premium board with an Soundblaster Audigy 2 ZS card. I have disabled the onboard sound and STILL get the same issue. I tried on another system with the same version of browser but with different video,audio and board (965 chipset) and that works perfectly.
It appears this problem has not been resolved yet.
I’m sorry, I have a totally different problem that started recently. It is a similar experience to a webpage loading text fast, loading a picture much slower in the background, then suddenly the picture pops up and the text scrolls down. This example only happens with poor webpage design. But the bug that’s annoying me is Firefox related, not website related.
-I browse to a page, it loads 100 %
-I start reading, scroll down either using keyboard or scroll bar
-I spot a link that I want to click, move my mouse to it and the text jump-scrolls some lines up or down, making me click in the wrong spot.
It is very annoying but I can’t find it on bugzilla or anywhere else on the web. Probably because I’m not able to express the problem in a few words like bugzilla /google, whatever, expect.
Any help, like a bugzilla url of a related report, a way to express this in few clear words, a suggestion how to prevent this from happening, anything is very welcome. please use email, one off topic comment here is more than enough. mrond at tiscali dot nl