Closed Bug 132337 Opened 22 years ago Closed 20 years ago

Floating div with overflow auto flickers while resizing window or during load (reflow)

Categories

(Core :: Layout, defect, P3)

defect

Tracking

()

RESOLVED FIXED
Future

People

(Reporter: info, Unassigned)

References

()

Details

(Keywords: testcase)

Attachments

(1 file, 1 obsolete file)

Using Build: 2002032003 on Win2k

I will attach a sample html doc.

I created 3 floating div tags, one after another so they appear on the same
horizontal plain.  The overflow is set to "Auto" to allow scrolling if the
content in the div exceeds the div size.  

Expected results:  
When the content exceed the div size, I would be able to scroll the div item and
see the items remain solid and scroll as in any normal div.

Actual results:
The div to the left will flicker when being scrolled - showing the contents of
the floating divs to the right rather than its' own contents.
Attached file Example of flickering floating div (obsolete) —
confirming on linux.  It looks like we reflow the div to zero size and then
back...  Looks terrible.
Status: UNCONFIRMED → NEW
Ever confirmed: true
OS: Windows 2000 → All
Hardware: PC → All
Priority: -- → P3
Target Milestone: --- → Future
Seen on W2K 2002031104 too.
Here's a similar example on a commercial site:
http://www.lynuxworks.com/bctshirt/index.php3.  In tis example, not only does
the div flicker, but the div is redrawn in the upper-left of the screen on top
of other content during the flickering.

Also, the small fixed background image in this example's div scrolls a bit
instead of staying in place.
Looks like a dup of bug 57511.  Boris Zbarsky made the observation that it's
reflowing to zero width, then back.  That's what I see in the other bug.  The
body is only wide enough for one floating div, but when it reflows to zero
width, the second moves up, and you see it drawn up there for a split second.
I'm also seeing this bug, and created a small test case for it at
<http://homepage.mac.com/mstockman/testcase>. Interestingly, I see this in
Windows 2000 Professional, Mozilla Build ID 2002091608, but not with an
almost-as-recent build on Mac OS X.

Just some additional info that will, I hope, help get this cosmetic bug
confirmed/assigned/fixed.
NO flicker on testcase and url:s mentioned, using build 2002102108, Windows 2000
Same here, no evidence of the mentioned problems everything is fine.
Mozilla 1.3a
Weird, with build 2002120604, Windows 2000 I see a really bad flickering on all
url, examples.
Mozilla 1.3, Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.3)
Gecko/20030312, Windows XP Pro, Build 2600.xpsp1.020828-1920

I see this problem when resizing the browser window while viewing the attachment
for this bug, similar to the behavior I see in comment 6.

However, comment 4 WFM.
The cases discussed WFM, build 2003052508, Win XP.
Keywords: testcase
It now occurs only while resizing, so I'll update the summary.  This is easy to
see with the active resizing you get when you enable "show window contents while
dragging" in windows, or when you use the resize widget in the bottom right corner.
Summary: Bad flickering when scrolling a floating DIV tag → Floating div flickers while resizing window
Attached file Simplified testcase
It happens when a floating div with overflow:auto is pushed to the side by the
previous floating div.	During reflow, the floating div with overflow:auto is
drawn for a moment as if the other isn't there.  It looks like the div with
overflow:auto is being processed first during the reflow, and then moved when
the other (previous) div gets a width.
Attachment #75200 - Attachment is obsolete: true
Assignee: attinasi → nobody
QA Contact: chrispetersen → core.layout
Summary: Floating div flickers while resizing window → Floating div with overflow auto flickers while resizing window or during load
Added url testcase. It will flicker when you resize, adding more text in the div
will result in that you also see the flicker while loading the page.
*** Bug 228059 has been marked as a duplicate of this bug. ***
*** Bug 221858 has been marked as a duplicate of this bug. ***
Bug 246587 looks like a dupe of this?
*** Bug 242230 has been marked as a duplicate of this bug. ***
Build: Firefox 20040911

I am seeing the same thing - it is not limited to resizing as some have
suggested.   Altering the "Simplified testcase" so the right div shows (say)
100,000 lines causes a very noticable flicker.  Alternatively, have fewer lines
and add some images into the div.
*** Bug 239706 has been marked as a duplicate of this bug. ***
Depends on: 238493
*** Bug 246587 has been marked as a duplicate of this bug. ***
I noticed something, when you visit this testcase in a new tab and resize:
http://bugzilla.mozilla.org/attachment.cgi?id=147532&action=view

You will not see the flicker. Now open the same url in a new window, resize it
and you will see the flicker.
As we get more and more users (we really do now) this is a highly visible issue
and it shows on very many sites. Many users I think will notice this and think
firefox/suite/netscape/whatever is a bad browser. Because of this high
visibility I am requesting blockage for 1.8a4.
Flags: blocking1.8a4?
*** Bug 238714 has been marked as a duplicate of this bug. ***
Flags: blocking1.8a4? → blocking1.8a4-
See http://www.exponet.pl/duzyplik.html for a real-world example (this page was
reported in a duplicate bug 221858)
Also www.gamespot.com and www.anandtech.com both show this.  Gamespot is really
bad, while it's intermitten on Anandtech.
*** Bug 262873 has been marked as a duplicate of this bug. ***
*** Bug 246394 has been marked as a duplicate of this bug. ***
*** Bug 260053 has been marked as a duplicate of this bug. ***
*** Bug 263815 has been marked as a duplicate of this bug. ***
*** Bug 257902 has been marked as a duplicate of this bug. ***
Summary: Floating div with overflow auto flickers while resizing window or during load → Floating div with overflow auto flickers while resizing window or during load (reflow)
URL and Testcases WFM using Mozilla Trunk Nightly Build 2004101605 on Windows XP.
The behavior on Windows XP improved between Mozilla Trunk Nightly Build
2004101107 and 2004101206.
Just tested in 2004101521 on Linux and it WFM.  It will be nice to see this
smoother layout reflow in release builds!
This bug affects our site quite heavily : http://www.tvnz.co.nz

I'm currently in the process of redesigning the template - moving away from
tables, and hence using more floating 'divs'.

Here is a sample of my new layout that displays the flicker on load:
http://images.tvnz.co.nz/test/new/index.html

Note that this flicker occurs on page load, but possibly more importantly, it
occurs when moving into and out of the 'a:hover' state on the 'cfb1 heading' link.

This is a priority issue for us, and we'd be keen to see it resolved ASAP.
(In reply to comment #34) 
> Here is a sample of my new layout that displays the flicker on load:
> http://images.tvnz.co.nz/test/new/index.html
> 
> Note that this flicker occurs on page load, but possibly more importantly, it
> occurs when moving into and out of the 'a:hover' state on the 'cfb1 heading' link.

I tried this in a nightly build 2004101521 and there is no problem.  It looks as
though these issues have been resolved.  You can wait until the next branch
release or download a nightly and check for yourself.

I've tried the latest nightly build, and the problem is still there.
I omitted to mention that I'm using Firefox on WinXP.
dan: this is only fixed on trunk (resolving as such).  firefox lives on its own
branch.
Status: NEW → RESOLVED
Closed: 20 years ago
Resolution: --- → FIXED
*** Bug 268124 has been marked as a duplicate of this bug. ***
Sorry for the spam, but does this mean that the fix won't go into 1.0 (which I
hope it will)? I am still seeing the bug in 1.0rc2. Thanks
I really hope this can go into Firefox 1.0 as well.  Right now, this is the only
bug that I see consistently, and it is really annoying.  And unlike some of the
other bugs, this one is easily noticeable to even novice users.  If not 1.0,
then hopefully it will go into 1.1.
Read bug 238493, comment 16 about checking this into the aviary branch.
Jose, yes, I know about that.  Just pointing out that it's the most visible bug
that I normally see.  This is also why I suggested putting it in 1.1 if it can't
make 1.0.
Warner, I was the one who was "silenced" with comment 16 in bug 238493. I think
the point is they know the scope and visibility of the bug, and don't wan't to
hear more of our ****. I been following bug 238493 after the checkin, and
there HAS been some regressions, so it seems they maked the right descision not
including it in FF1.0. As for FF1.1 it will be build "upon" the forthcomming
Mozilla 1.8, and the current developer-builds of this includes the fix. So
unless they find big problems which make them uncheck the fix, it looks like the
problem will be fixed in FF1.1.
I tested with Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; rv:1.8a5)
Gecko/20041113

The bugs does not appear anymore when loading or resizing, BUT it continues
appearing when changing font size with Ctrl + and Ctrl -

Should this bug be reopened or should we create a new bug entry ?
Hadrien: please do file a new bug and be sure to mention the testcase your
testing that still has a problem.
Ok, so here is bug 270032 ^^

The testcase is the same than the one here. But I have put an additional
testcase of my own, the one which made me found bug 132337.
hello there,

i still get some flickering stuff on the following page for example
(german online newspaper)

<http://www.stern.de/lifestyle/leute/index.html>

there on the right side you see a column with some advertisement like box that
reads "match.com" and displays some picture of some person.

there are two methods of triggering the flicker/misbehaviour of firefox:

1. simply resize your firefox window in any way, width, height, both... on my
box (windows2000 pro sp4 english with firefox 1.0) the picture and text of that
"match.com"-box suddenfly flickers on the same height to the left in the firefox
window. it seems as the whole part of that "match.com"-box with the picture and
the text on its right side next to it, simply gets replicated/redrawn on the
left hand side at the edge of the firefox window.

2. if you click onto the text next to the picture of the persons in that
"match.com" box a new firefox window will be triggered with
"http://stern.match.com". just before this new firefox window appears on my box,
that picture and the text next to it gets drawn (flickers/displays once and then
vanishes) on the left side of the firefox window, right before the new firefox
window opens up.

Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; rv:1.7.5) Gecko/20041107 Firefox/1.0

is this some new sort of bug? cos my flickering bug got assigned to this one
some time back, as i had opened my own separate bug. later i got moved to this one.

cheers.
some more hints:

i just took a look again at my own bugreport that got marked as a duplicate to
this bug:

<https://bugzilla.mozilla.org/show_bug.cgi?id=260053>

back then i was talking about a link that caused the flickering:
<http://www.stern.de/lifestyle/leute/index.html?id=529958>

now there is again that "match.com"-box over there, although this time the page
doesnt flicker at all when i resize the firefox window no matter how.

but the second method to generate the flickering still works here.

as soon as you click that text on the right side of the picture/face displayed
in that "match.com"-box, again a new firefox window opens up, and again right
before the firefox window appears, the whole content below the "match.com"-sign
gets replicated and redrawn on the left side inside the old firefox window.

hope this helps a little. cheers.
Well of course it flickers. No wonder at all. This is not fixed in 1.0, but on
the current trunk it is.

The fix will be in FF 1.0.

Always test with a recent build. Thank you.
(In reply to comment #49)
> The fix will be in FF 1.0.

That should be FF 1.1
*** Bug 268742 has been marked as a duplicate of this bug. ***
*** Bug 290970 has been marked as a duplicate of this bug. ***
*** Bug 291706 has been marked as a duplicate of this bug. ***
where is this bug fixed actually? its not fixed for me i guess....

i still see the stuff on pages like 
<http://www.stern.de/lifestyle/leute/index.html?id=529958>

when you click on the right side on the match.com dating box/text there....

it gets copied over to the left side above the normal news text of the page....

i am currently running 
Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; rv:1.8b3) Gecko/20050712
Firefox/1.0+ (deepark 1.0+ alpha2 from yesterday or so...)
Flash ads flicker with Firefox 1.7.9

Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.9) Gecko/20050711
Firefox/1.0.5

Pages:

Flickers on http://news.com.com/

Ads appear on both sides of screen (it's actually placed on the right side) at:

http://www.cnet.com/  and    

http://www.marketwatch.com/news/default.asp?siteid=mktw&dist=ctmw&refresh=on
*** Bug 302519 has been marked as a duplicate of this bug. ***
*** Bug 303178 has been marked as a duplicate of this bug. ***
*** Bug 306491 has been marked as a duplicate of this bug. ***
*** Bug 312992 has been marked as a duplicate of this bug. ***
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: