Bug 245225 - wrong input text position with line-height
Summary: wrong input text position with line-height
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: Layout and Rendering (show other bugs)
Version: Safari 15
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: zalan
URL:
Keywords: BrowserCompat, InRadar
Depends on:
Blocks:
 
Reported: 2022-09-15 09:12 PDT by Christopher Adels
Modified: 2023-05-26 17:20 PDT (History)
14 users (show)

See Also:


Attachments
[fast-cq]Patch (4.99 KB, patch)
2023-05-26 14:20 PDT, zalan
no flags Details | Formatted Diff | Diff
line height vs. input box (362.37 KB, video/quicktime)
2023-05-26 14:22 PDT, zalan
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Christopher Adels 2022-09-15 09:12:33 PDT
When the input field has an big height and line-height, the position of the input text is wrong, while the placeholder is correct

see https://codepen.io/Chrisstopher/pen/zYjNdPd
Comment 1 Radar WebKit Bug Importer 2022-09-22 09:13:18 PDT
<rdar://problem/100278323>
Comment 2 Ahmad Saleem 2023-05-25 11:56:28 PDT
I am able to reproduce this bug in Safari 16.5 & WebKit ToT:

1) Show caret as small of small pixel and even selection container is below input field

2) Text typing is not central like Chrome Canary 115.

Just wanted to share latest test result. Thanks!
Comment 3 zalan 2023-05-25 12:46:41 PDT
This looks to be specific to strict mode (<!DOCTYPE html>)
Comment 4 zalan 2023-05-25 21:42:43 PDT
(In reply to zalan from comment #3)
> This looks to be specific to strict mode (<!DOCTYPE html>)
This is actually about line-height spilling out of the <input>'s shadow dom. (<!DOCTYPE html> is only needed if <input> is the only inline level element on the line (see invisible strut))
Comment 5 Karl Dubost 2023-05-25 21:51:34 PDT
And that looks like a duplicate of Bug 167209
Comment 6 Karl Dubost 2023-05-25 21:52:44 PDT
Other bugs related to line-height and input:   bug 236108 and bug 203751
Comment 7 zalan 2023-05-26 14:20:40 PDT
Created attachment 466507 [details]
[fast-cq]Patch
Comment 8 zalan 2023-05-26 14:22:32 PDT
Created attachment 466508 [details]
line height vs. input box
Comment 9 zalan 2023-05-26 16:06:22 PDT
(In reply to Karl Dubost from comment #5)
> And that looks like a duplicate of Bug 167209
took a brief look at it. sadly it is a very different issue (but easy to address). will post a patch soon.
Comment 10 EWS 2023-05-26 17:20:28 PDT
Committed 264613@main (1446d6fed86f): <https://commits.webkit.org/264613@main>

All reviewed patches have been landed. Closing bug and clearing flags on attachment 466507 [details].