| Summary: | Scrolling to reveal a text input fails if the parent is CSS-transformed | ||||||
|---|---|---|---|---|---|---|---|
| Product: | WebKit | Reporter: | Reilly Hamilton <reilly.hamilton> | ||||
| Component: | CSS | Assignee: | Nobody <webkit-unassigned> | ||||
| Status: | RESOLVED CONFIGURATION CHANGED | ||||||
| Severity: | Normal | CC: | bfulgham, mitz, simon.fraser, webkit | ||||
| Priority: | P2 | ||||||
| Version: | 528+ (Nightly build) | ||||||
| Hardware: | All | ||||||
| OS: | All | ||||||
| URL: | http://jsfiddle.net/ZbguJ/6/ | ||||||
| Attachments: |
|
||||||
Some "scroll to visible" code is broken with transforms. I can't reproduce this in Safari Version 9.1.1 on OS X. Safari, Chrome, and Firefox all agree on rendering for this test case. I don't believe there is any remaining compatibility issue. |
Created attachment 166965 [details] Test case showing desired and incorrect behavior If -webkit-transform: translate(##px,0) has been applied to an element with overflow:auto, entering text in children text inputs causes the scrolling parent element to scroll to an incorrect location. In the test case, scroll to the bottom of each scrolling div and type in a text input. If the scrolling div has been translated, the div scrolls back up to the top inexplicably, and the entered text is not visible. In the non-translated case, no scrolling occurs, which is the desired behavior. Similar improper scrolling behavior occurs in translated textarea elements with overflow:auto. Observed in: * Chrome 22.0.1229.79 m for Windows, AppleWebKit/537.4 * Safari 5.1.7 for Windows, AppleWebKit/534.57.2 * iOS 5.1.1 Safari, AppleWebKit/534.46 * iOS 6 Safari, AppleWebKit/536.26