Bug 208474

Summary: Ugly and misaligned validation bubble
Product: WebKit Reporter: Ferdy Christant <ferdy.christant>
Component: FormsAssignee: Nobody <webkit-unassigned>
Status: RESOLVED DUPLICATE    
Severity: Normal CC: cdumez, wenson_hsieh
Priority: P2    
Version: Safari 13   
Hardware: iPhone / iPad   
OS: iOS 13   
Attachments:
Description Flags
Screenshot of validation tooltip none

Description Ferdy Christant 2020-03-02 14:34:31 PST
Created attachment 392193 [details]
Screenshot of validation tooltip

See screenshot. When using HTML5 native validation on form elements, the browser will use a tool-tip to alert users of invalid values.

In the case of iOS Safari 13 (only version I tested), the tool-tip is rendered very poorly. Specifically, the tool-tip is quite high with the validation message being top-aligned, whereas it should be vertically middle aligned.

Although this seems a minor issue, I do find it very annoying, because I was aiming to go for a pure HTML5 validation solution without any script involved. The tooltips generally look OK across browsers, yet mobile Safari is way off, it seems.
Comment 1 Chris Dumez 2020-03-02 14:52:03 PST

*** This bug has been marked as a duplicate of bug 208472 ***
Comment 2 Ferdy Christant 2020-03-02 14:57:17 PST
Sorry for double posting, had some token issue. The duplicate can be removed.