WebKit Bugzilla
New
Browse
Log In
×
Sign in with GitHub
or
Remember my login
Create Account
·
Forgot Password
Forgotten password account recovery
RESOLVED FIXED
183079
[Simple line layout] Text with letter spacing is not positioned properly.
https://bugs.webkit.org/show_bug.cgi?id=183079
Summary
[Simple line layout] Text with letter spacing is not positioned properly.
Tobi Reif
Reported
2018-02-23 04:06:55 PST
Created
attachment 334516
[details]
the code (Please replace the title with something more specific.) Please open the current version of
https://tobireif.com/demos/grid/
in current Safari, set the window width to eg 630, and click on "Layout 2" - the text "The Sane Choice!" is off-center and cut off. (Same issue in the current Tech Preview.) Please also resize the window to various widths and observe that line of text. Attaching a zip so that you have the code that shows the Webkit issue even if I change the relevant code in my page.
Attachments
the code
(42.55 KB, application/zip)
2018-02-23 04:06 PST
,
Tobi Reif
no flags
Details
screenshot of the page in the zip, in Safari
(399.12 KB, image/png)
2018-02-23 04:44 PST
,
Tobi Reif
no flags
Details
screenshot of the page in the zip, in Chrome
(251.78 KB, image/png)
2018-02-23 04:45 PST
,
Tobi Reif
no flags
Details
r228947 centered text
(411.89 KB, image/png)
2018-02-23 07:31 PST
,
alan
no flags
Details
screenshot_of webkit_228949
(435.66 KB, image/png)
2018-02-23 09:16 PST
,
Tobi Reif
no flags
Details
Test reduction
(218 bytes, text/html)
2018-03-22 11:14 PDT
,
alan
no flags
Details
Patch
(4.72 KB, patch)
2018-03-22 14:03 PDT
,
alan
no flags
Details
Formatted Diff
Diff
View All
Add attachment
proposed patch, testcase, etc.
Tobi Reif
Comment 1
2018-02-23 04:28:41 PST
P.S. When I comment out this line it works: .layout2 .page aside { grid-row: 3; grid-column: 1; align-self: center; justify-self: center; /* text-align: center; */ } But I think it should work wit the code as it was before (as in the zip). (The version in the zip works in Chrome etc but not in Safari. I think that should get fixed in any case.)
Tobi Reif
Comment 2
2018-02-23 04:30:05 PST
"wit" -> "with"
Tobi Reif
Comment 3
2018-02-23 04:44:28 PST
Created
attachment 334517
[details]
screenshot of the page in the zip, in Safari
Tobi Reif
Comment 4
2018-02-23 04:45:02 PST
Created
attachment 334518
[details]
screenshot of the page in the zip, in Chrome
Tobi Reif
Comment 5
2018-02-23 04:45:36 PST
Perhaps the issue is related to justify-self:center?
alan
Comment 6
2018-02-23 07:30:43 PST
It seems to be working fine with
r228947
. See attached screenshot. (unless I am not resizing the viewport right).
alan
Comment 7
2018-02-23 07:31:09 PST
Created
attachment 334531
[details]
r228947
centered text
Tobi Reif
Comment 8
2018-02-23 09:16:10 PST
Thanks for trying to reproduce the issue! I tried it again and was able to reproduce the issue in the latest WebKit (as in current Safari and Tech Preview). I downloaded the latest WebKit from
https://webkit.org/build-archives/
:
https://s3-us-west-2.amazonaws.com/minified-archives.webkit.org/mac-highsierra-x86_64-release/228949.zip
Then I used Chrome (with dev tools open so that Chrome show the dimensions) to get a window of 630 width. Then I opened the page from the zip in the browser that's launched by run-webkit-archive, set the window width to the same width as the 630 wide Chrome window, and on the page clicked on the button "Layout 2". The text "The Sane Choice!" is off-center and cut off, see "screenshot_of webkit_228949.png".
Tobi Reif
Comment 9
2018-02-23 09:16:53 PST
Created
attachment 334534
[details]
screenshot_of webkit_228949
Tobi Reif
Comment 10
2018-02-26 02:00:07 PST
I hope you can reproduce the issue using my latest steps.
Tobi Reif
Comment 11
2018-03-01 01:34:06 PST
I just tried it again, on a different machine, and was able to reproduce the issue again (using the attached zip named "the code"). I followed the latest steps (using Safari stable) I describe in
comment 8
- the text "The Sane Choice" is off-center and cut off (that is the issue). Here's a screenshot:
https://app.crossbrowsertesting.com/public/ib8393c20a124bac/livetests/10895686/snapshots/z38c277928dc80b55a1d
I hope you can reproduce and fix the issue.
alan
Comment 12
2018-03-01 14:21:29 PST
Simple and normal line layout disagree :(
alan
Comment 13
2018-03-22 11:14:58 PDT
Created
attachment 336291
[details]
Test reduction Test reduction. Dynamic letter spacing fails with simple line layout.
Radar WebKit Bug Importer
Comment 14
2018-03-22 12:44:20 PDT
<
rdar://problem/38762569
>
alan
Comment 15
2018-03-22 13:03:11 PDT
RenderText::m_canUseSimplifiedTextMeasuring needs updating after style change since we might be able to use the fast path after certain (letter spacing etc) style change.
alan
Comment 16
2018-03-22 14:03:16 PDT
Created
attachment 336310
[details]
Patch
WebKit Commit Bot
Comment 17
2018-03-22 14:59:46 PDT
Comment on
attachment 336310
[details]
Patch Clearing flags on attachment: 336310 Committed
r229867
: <
https://trac.webkit.org/changeset/229867
>
WebKit Commit Bot
Comment 18
2018-03-22 14:59:47 PDT
All reviewed patches have been landed. Closing bug.
Tobi Reif
Comment 19
2018-03-23 02:41:50 PDT
Thanks all!
Tobi Reif
Comment 20
2018-03-27 00:31:50 PDT
I just checked in the latest WebKit from
https://webkit.org/build-archives/
- it works! Thanks!
alan
Comment 21
2018-03-27 07:15:31 PDT
(In reply to Tobi Reif from
comment #20
)
> I just checked in the latest WebKit from
https://webkit.org/build-archives/
> - it works! Thanks!
Thank you for verifying it!
Note
You need to
log in
before you can comment on or make changes to this bug.
Top of Page
Format For Printing
XML
Clone This Bug