Issue metadata
Sign in to add a comment
|
Pixels on right side of button clip when background has gradient
Reported by
k...@moretz.com,
Oct 27
|
||||||||||||||||||||||||
Issue description
Chrome Version : 69.0.3497.81
OS Version: Pop!_OS (Linux, Ubuntu-based) 18.04 LTS
URLs (if applicable) : (not included, as the page requires being signed up to view the problematic component. This is impossible as we are currently in private beta)
Other browsers tested:
Add OK or FAIL after other browsers where you have tested this issue:
Firefox: OK
What steps will reproduce the problem?
1. Create a button with a border-radius and a linear-gradient background, within a div
(I am not entirely sure what characteristics this containing div must have, as I have been unable to replicate it in some cases without divs similar to those in my application. The test case file has three containers with various characteristics that properly replicate the problem, but I am unsure which of these are entirely necessary.)
2. Resize the screen (with a screen width of at least 400px in the test case uploaded) and view the button while resizing.
What is the expected result?
The full rounded border of the button consistently appears, rather than varying based on the screen width.
What happens instead of that?
The right side of the button appears to intermittently clip off the edge of the rounded border, and stays this way at certain screen widths but not others.
Please provide any additional information below. Attach a screenshot if
possible.
In my application, there is also a 1px wide div with a darkened background that acts as a divider, which clips to appear as if it is 0px wide at certain screen widths. This was more difficult to condense into a simplified demonstration, but if it is necessary and these bugs are not connected I can produce a demonstration of that as well and report it separately. However, these do seem to be connected, as they both clip at the same screen widths.
I have additionally attempted to resolve this by disabling hardware acceleration, which did not solve the problem for me.
UserAgentString: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Ubuntu Chromium/69.0.3497.81 Chrome/69.0.3497.81 Safari/537.36
,
Oct 29
,
Oct 29
,
Nov 9
I have created a fiddle which reproduces the issue using Chrome Version 70.0.3538.77 (Official Build) (64-bit) on MacOS 10.14. In my case however, the bottom is clipped. https://jsfiddle.net/0geyfb63/
,
Dec 6
,
Dec 13
This was not fixed by https://crrev.com/1c633d483b5e6777fe2ffc5cea93398083638f6e
,
Dec 17
|
|||||||||||||||||||||||||
►
Sign in to add a comment |
|||||||||||||||||||||||||
Comment 1 by krajshree@chromium.org
, Oct 29