Bug 60047 - Toggling overflow with :hover results in inadequate repaint
: Toggling overflow with :hover results in inadequate repaint
Status: NEW
: WebKit
: 525.x (Safari 3.2)
: All All
: P2 Normal
Assigned To:
: http://www.chaos.org.uk/~jf/Chrome-re...
  Show dependency treegraph
Reported: 2011-05-03 11:37 PST by
Modified: 2013-09-12 12:31 PST (History)

Self-contained test-case (1.18 KB, application/xhtml+xml)
2011-05-04 00:08 PST, J Fairbairn
no flags Details
simplified test-case (602 bytes, text/html)
2012-06-15 00:50 PST, Michal Čaplygin
no flags Details
simplified test-cases' screenshot (7.47 KB, image/png)
2012-06-15 00:55 PST, Michal Čaplygin
no flags Details


You need to log in before you can comment on or make changes to this bug.

Description From 2011-05-03 11:37:19 PST
See URL and its linked stylesheet for example.

Hovering over the 42 causes the "detail" division to be displayed, but moving the cursor away causes only 42 to be repainted, leaving the rest of the division visible.

Bug is only triggered if overflow on the containing block (class "cell" in the example) is switched from hidden to visible on :hover.

The effect is present in at least google-chrome 11.0.696.57 beta (Linux SL6 gtk2-2.18.9-4), 11.0.696.48 beta (Linux Fedora 14 gtk2-22.0-1), and Safari 5.0.5 (6533.21.1) on Mac OS 10.6.7
------- Comment #1 From 2011-05-03 18:06:02 PST -------
Please attach a self-contained test case to this bug. Thanks.
------- Comment #2 From 2011-05-04 00:08:32 PST -------
Created an attachment (id=92198) [details]
Self-contained test-case
------- Comment #3 From 2011-06-14 15:43:58 PST -------
*** Bug 62641 has been marked as a duplicate of this bug. ***
------- Comment #4 From 2012-06-15 00:50:53 PST -------
Created an attachment (id=147765) [details]
simplified test-case

Attaching simplified test-case (spotted this bug myself and made this test before finding this report).

Swapping overflow of container AND swapping display of child node which is absolutely positioned apparently does this.
------- Comment #5 From 2012-06-15 00:55:26 PST -------
Created an attachment (id=147766) [details]
simplified test-cases' screenshot

Screenshot of above test-case. Same appearance in Safari 5.1.5 @ W7 64; Chromium 21 @ Ubuntu, Google Chrome 19 ...
------- Comment #6 From 2013-09-09 06:59:24 PST -------
This is still an issue for me in Chrome Version 29.0.1547.65 in Sept' 2013.

As reported in this stack issue, a workaround is to add -webkit-transform: scale3d(1,1,1); to force webkit to use the 3d rendering engine.