Bug 44110 - Transitions paired with relative position causes a content flash
Summary: Transitions paired with relative position causes a content flash
Status: RESOLVED DUPLICATE of bug 47175
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: 528+ (Nightly build)
Hardware: Mac (Intel) OS X 10.6
: P3 Minor
Assignee: Nobody
URL: http://nwhsu.insidenewcity.com/test.html
Keywords:
Depends on:
Blocks:
 
Reported: 2010-08-17 08:27 PDT by Wes Baker
Modified: 2010-12-07 14:09 PST (History)
2 users (show)

See Also:

Attachments
Add an attachment (proposed patch, testcase, etc.)

Note You need to log in before you can comment on or make changes to this bug.
Description Wes Baker 2010-08-17 08:27:37 PDT 
When I hover over an item that has a CSS transition, it's parent's siblings flash. The siblings and the parent all have relative positioning and z-indicies. This bug is hard to reproduce, but it's definitely there.

Here are the conditions:
- Container (header) holding transitioned item is positioned relative and has a z-index of 100
- Container (nav-main) below header is positioned relative and has a z-index of 500
- Container (content) below nav-main is positioned relative and has a z-index of 100
- Nav-main has a form with a <input type="submit"> with image replacement (background + text-indent: -9999px, etc)

Replacing the <input type="submit"> with an <input type="image"> seems to fix things.
Comment 1 Wes Baker 2010-08-17 08:30:28 PDT 
This is happening in Safari 5.01 and the Webkit Nightly.
Comment 2 Simon Fraser (smfr) 2010-12-07 14:09:04 PST 
Your Go button has text-indent: -9999px, which forces tiled layers. You should set overflow:hidden on that element.

*** This bug has been marked as a duplicate of bug 47175 ***