transform(50%, *) causes blurry content OR borders missing on text inputs when the full height of the element is an odd number of pixels.
Reported by
jason.sp...@gmail.com,
Aug 4 2017
|
||||
Issue descriptionUserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.90 Safari/537.36 Steps to reproduce the problem: 1. Have an element with a transform of -50%, and a height of an odd number of pixels 2. top border is missing on contained input elements OR all modal content is blurry 3. What is the expected behavior? content is neither blurry, nor missing borders. What went wrong? Content was blurry or missing borders. Did this work before? N/A Does this work in other browsers? N/A Chrome version: 60.0.3112.90 Channel: stable OS Version: 10.0 Flash Version: I can reproduce the blurry content bug on our internal site (cannot share that site as a repro) but can only reproduce the missing input borders on my repro. I have attached screenshots of the blurriness when (modalHeight % 2 === 1) (is an odd number of pixels tall).
,
Aug 7 2017
Tested the issue on windows on 10 & 7 using chrome M60 #60.0.3112.90 and M62 #62.0.3177.0 and observed input filed border is missing. Attached screenshot for reference. @jason.spradlin.chr-- Could you please check attached screenshot and confr=irm if this is the issue , so that we can continue bisecting the issue. Thanks!
,
Aug 18 2017
Yes this screenshot shows the correct issue. Sorry i didn't get emailed regarding this.
,
Aug 18 2017
Thank you for providing more feedback. Adding requester "hdodda@chromium.org" to the cc list and removing "Needs-Feedback" label. For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
,
Aug 21 2017
When using transforms content is not aligned to device pixels resulting in the observed behavior. This is needed to allow smooth animations and avoiding stair-step like behavior. Try to avoid using transforms to position static content. Negative margins, absolute, or relative positioning all trigger device pixel alignment and are more suitable for re-positioning content.
,
Aug 21 2017
That might be a good recommendation (not using transforms for positioning static content), but it is not a solution to the issue. |
||||
►
Sign in to add a comment |
||||
Comment 1 by manoranj...@chromium.org
, Aug 5 2017