Issue metadata
Sign in to add a comment
|
Animation of div with 'transform: scale' breaks property 'overflow: hidden' of other div and its inner element becomes uncutted.
Reported by
adamovic...@gmail.com,
Feb 27 2017
|
||||||||||||||||||||||||
Issue descriptionUserAgent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:51.0) Gecko/20100101 Firefox/51.0 Steps to reproduce the problem: 1. Create the first div with border-radius and overflow:hidden. 2. Put any other element inside the first div. This element must have non-static position and non-zero z-index. 3. Create the second div with hover properties "transition: ...s" and "transform: scale(..., ...)". What is the expected behavior? When a mouse is over the second div, the element wich is located inside the first div must stay cutted by the border of the first div. What went wrong? The element wich is located inside the first div becomes uncutted by its parent div (the first div). Did this work before? N/A Does this work in other browsers? Yes Chrome version: <Copy from: 'about:version'> Channel: n/a OS Version: 10.0 Flash Version: http://codepen.io/Nikolai-Adamovich/pen/KWpXob
,
Feb 27 2017
This renders correctly for me (same as the Firefox/IE11/Edge image) in the following configurations: Chrome 57 ChromeOS high-dpi Chrome 56 Android Chrome 55 Windows low-dpi Your repro is on Windows, right? What Chrome version (from about:version) - you left that blank in the template.
,
Feb 27 2017
Version 53.0.2785.116 m, Windows 10 x64.
,
Feb 27 2017
Just tested it in Android 5.1.0, Chrome 56.0.2924.87. The same bug. When I click the blue div on my touch screen, animation starts and that element becomes uncutted while animation is running. When animation is done, the element becomes cutted by border-radius of its parent div.
,
Feb 28 2017
,
Feb 28 2017
This has been fixed in M57.
,
Feb 28 2017
|
|||||||||||||||||||||||||
►
Sign in to add a comment |
|||||||||||||||||||||||||
Comment 1 by adamovic...@gmail.com
, Feb 27 20175.2 KB
5.2 KB View Download