New issue
Advanced search Search tips

Issue 601209 link

Starred by 1 user

Issue metadata

Status: Fixed
Owner:
Closed: Apr 2016
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Mac
Pri: 2
Type: Bug-Regression



Sign in to add a comment

HTML text input has 1px shift in baseline on Chrome 50

Reported by s0201...@gmail.com, Apr 6 2016

Issue description

UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.57 Safari/537.36

Example URL:

Steps to reproduce the problem:
1. Create a <div> and a <input type="text"> with the same text content.
2. Make sure they have the same font style, width, padding and margin.
3. Set height: 33px and line-height: 33px on both of them.

What is the expected behavior?
Both elements should render text that looks exactly the same.

What went wrong?
On Chrome 50, the text baseline in <input> is 1px lower than that of <div>

Does it occur on multiple sites: N/A

Is it a problem with a plugin? N/A 

Did this work before? Yes Chrome 49

Does this work in other browsers? Yes 

Chrome version: 50.0.2661.57  Channel: n/a
OS Version: OS X 10.11.4
Flash Version: Shockwave Flash 21.0 r0

Does not happen in the following browser (i.e. text baseline in both elements are the same):
Safari Version 9.1 (11601.5.17.1)
Firefox Version 45.0.1
 
test-textfield-baseline.html
1.5 KB View Download
Components: Blink>HTML
Labels: Needs-Feedback
Tested the issue on Windows 7, Mac 10.10.5, Ubuntu 14.04 using 50.0.2661.57, latest beta 50.0.2661.66, canary 51.0.2701.0 with below steps:

1.Opened test-textfield-baseline.html in chrome and firefox.
2.Observed the screen in chrome same as in firefox.

Please find attached screenshots of chrome and firefox.

s0201522@Could you please provide expected behavior screenshot for better understanding the issue to triage it further.
601209_chrome.png
28.2 KB View Download
601209_firefox.png
12.3 KB View Download

Comment 2 by s0201...@gmail.com, Apr 7 2016

Thanks for following up. I guess the issue is platform-specific. I can reproduce on Mac OSX 10.11.4 (15E65).

Attached screenshots of various browsers running on the above platform. Note that the 1px shift can be observed on Chrome 50 beta but not the others.

chrome 50.0.2661.57 beta (64-bit) - 1px shift observed.png
53.9 KB View Download
safari 9.1 (11601.5.17.1) - no shift.png
22.8 KB View Download
firefox 45.0.1 - no shift.png
38.3 KB View Download
Chrome 49 - no shift.png
17.8 KB View Download

Comment 3 by tkent@chromium.org, Apr 8 2016

Components: -Blink>HTML Blink>Forms>Text Blink>Layout
Project Member

Comment 4 by sheriffbot@chromium.org, Apr 8 2016

Labels: -Needs-Feedback Needs-Review
Owner: ssamanoori@chromium.org
Thank you for providing more feedback. Adding requester "ssamanoori@chromium.org" for another review and adding "Needs-Review" label for tracking.

For more details visit https://sites.google.com/a/chromium.org/dev/issue-tracking/autotriage - Your friendly Sheriffbot
Labels: -Needs-Review
Owner: ----

Comment 6 by e...@chromium.org, Apr 11 2016

Cc: drott@chromium.org kojii@chromium.org szager@chromium.org e...@chromium.org
Status: Available (was: Unconfirmed)

Comment 7 by tkent@chromium.org, Apr 14 2016

I couldn't reproduce this issue with Google Chrome 50 on OSX 10.11.4.

Comment 8 by tkent@chromium.org, Apr 14 2016

Oops, #7 was wrong.  I reproduced it with Google Chrome 50.0.2661.75 stable, but I didn't reproduce it with Google Chrome 52 canary.

Comment 9 by tkent@chromium.org, Apr 14 2016

Labels: Needs-Bisect
Labels: Needs-Feedback
Tested the issue on Mac 10.10.5, Mac 10.11.4 using 50.0.2661.57, latest stable 50.0.2661.75, canary 52.0.2708.0.Unable to reproduce the issue. Observed the same properties for left and right div on both stable and canary versions.

Please find attached screencast and update if anything missed here in triaging the issue. 
601209.mp4
3.2 MB Download

Comment 11 by tkent@chromium.org, Apr 18 2016

s0201522@, do you see this problem with Google Chrome 52 canary?
https://www.google.com/chrome/browser/canary.html

Comment 12 by s0201...@gmail.com, Apr 18 2016

ssamanoori@, I looked at your screencast and observed the 1px shift too. Please take a look at screencast-1px-shift.png. I added a yellow line to help indicate the difference. LHS is chrome & OS version.

tkent@, I can repro on latest official canary (52.0.2711.0) and my OS is OSX 10.11.4. See attached 50&52-10.11.4.png.

Hope that help, thanks.
screencast-1px-shift.png
244 KB View Download
50&52-10.11.4.png
166 KB View Download

Comment 13 by tkent@chromium.org, Apr 18 2016

Labels: -Needs-Feedback
#12, thank you for the feedback.

I tried again with 52 canary, and reproduced with 200% zoom.

Comment 14 by tkent@chromium.org, Apr 19 2016

Labels: -Type-Compat -Needs-Bisect Type-Bug-Regression
Owner: tkent@chromium.org
Status: Assigned (was: Available)
Bisect resut:

You are probably looking for a change made after 369974 (known good), but no later than 369976 (first known bad).
CHANGELOG URL:
  https://chromium.googlesource.com/chromium/src/+log/624f51b77ff5583f00dff0cdddd286a4192aebfb..3e059a67bd5a3923d8653b42191d1ff7a3341a2a

Ah, it's mine.

Comment 15 by tkent@chromium.org, Apr 19 2016

Status: Started (was: Assigned)
The root cause is LayoutMod(value, 2) always returns 0.

Comment 16 by tkent@chromium.org, Apr 19 2016

> The root cause is LayoutMod(value, 2) always returns 0.

This was not the root problem.  Changing layoutMode() to intMod() resolved a specific case, but didn't fix other cases.

Project Member

Comment 17 by bugdroid1@chromium.org, Apr 26 2016

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/5418e1dbff8bdbea12ea0e55c8dc8828fdbbd820

commit 5418e1dbff8bdbea12ea0e55c8dc8828fdbbd820
Author: tkent <tkent@chromium.org>
Date: Tue Apr 26 13:17:33 2016

INPUT textfield: Do not remove line-height of innerEditor if we don't need to remove it.

The root cause of  crbug.com/601209  is a difference between
 - text centering behavior of taller line-height, and
 - innerEditor box centering behavior in LayoutTextControlSingleLine.

It's hard to unify them.  So this CL updates LayoutTextControlSingleLine::
createInnerEditorStyle so that line-height is not removed if we don't need to
remove it.

BUG= 601209 

Review URL: https://codereview.chromium.org/1915353003

Cr-Commit-Position: refs/heads/master@{#389767}

[modify] https://crrev.com/5418e1dbff8bdbea12ea0e55c8dc8828fdbbd820/third_party/WebKit/LayoutTests/TestExpectations
[add] https://crrev.com/5418e1dbff8bdbea12ea0e55c8dc8828fdbbd820/third_party/WebKit/LayoutTests/fast/forms/text/text-lineheight-centering-expected.html
[add] https://crrev.com/5418e1dbff8bdbea12ea0e55c8dc8828fdbbd820/third_party/WebKit/LayoutTests/fast/forms/text/text-lineheight-centering.html
[modify] https://crrev.com/5418e1dbff8bdbea12ea0e55c8dc8828fdbbd820/third_party/WebKit/Source/core/layout/LayoutTextControlSingleLine.cpp

Project Member

Comment 18 by bugdroid1@chromium.org, Apr 28 2016

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/1e3091ca2d8eccb26bee058d6ea9c87a115b3da8

commit 1e3091ca2d8eccb26bee058d6ea9c87a115b3da8
Author: tkent <tkent@chromium.org>
Date: Thu Apr 28 04:54:02 2016

Manual rebaseline for fast/forms/placeholder-position.html.

BUG= 601209 
TBR=kojii@chromium.org

Review-Url: https://codereview.chromium.org/1930793002
Cr-Commit-Position: refs/heads/master@{#390301}

[modify] https://crrev.com/1e3091ca2d8eccb26bee058d6ea9c87a115b3da8/third_party/WebKit/LayoutTests/TestExpectations
[modify] https://crrev.com/1e3091ca2d8eccb26bee058d6ea9c87a115b3da8/third_party/WebKit/LayoutTests/platform/linux/fast/forms/placeholder-position-expected.png
[modify] https://crrev.com/1e3091ca2d8eccb26bee058d6ea9c87a115b3da8/third_party/WebKit/LayoutTests/platform/linux/fast/forms/placeholder-position-expected.txt
[modify] https://crrev.com/1e3091ca2d8eccb26bee058d6ea9c87a115b3da8/third_party/WebKit/LayoutTests/platform/mac-mac10.10/fast/forms/placeholder-position-expected.txt
[modify] https://crrev.com/1e3091ca2d8eccb26bee058d6ea9c87a115b3da8/third_party/WebKit/LayoutTests/platform/mac-mac10.9/fast/forms/placeholder-position-expected.txt
[modify] https://crrev.com/1e3091ca2d8eccb26bee058d6ea9c87a115b3da8/third_party/WebKit/LayoutTests/platform/mac/fast/forms/placeholder-position-expected.txt
[modify] https://crrev.com/1e3091ca2d8eccb26bee058d6ea9c87a115b3da8/third_party/WebKit/LayoutTests/platform/win/fast/forms/placeholder-position-expected.png
[modify] https://crrev.com/1e3091ca2d8eccb26bee058d6ea9c87a115b3da8/third_party/WebKit/LayoutTests/platform/win/fast/forms/placeholder-position-expected.txt

Comment 19 by tkent@chromium.org, Apr 28 2016

Labels: M-52
Status: Fixed (was: Started)

Comment 20 by e...@chromium.org, Apr 28 2016

Thank you!

Sign in to add a comment