| Summary: | select text vertical alignment (baseline) is affected by preceding element with dynamic height | ||||||
|---|---|---|---|---|---|---|---|
| Product: | WebKit | Reporter: | andreyvlktn | ||||
| Component: | Forms | Assignee: | Nobody <webkit-unassigned> | ||||
| Status: | NEW --- | ||||||
| Severity: | Normal | CC: | cdumez, wenson_hsieh, zalan | ||||
| Priority: | P2 | ||||||
| Version: | Other | ||||||
| Hardware: | Mac | ||||||
| OS: | Other | ||||||
| Attachments: |
|
||||||
Created attachment 390367 [details] Test example I'm testing on Safari 11, OS X 10.11.6 Steps to reproduce the problem: 1. Open attached test.html 2. Resize window width continuously What is the expected behavior? The vertical alignment (baseline) of the text inside select and outside of it should be maintained What went wrong? The text inside select shifts vertically while the surrounding text stays intact. So that vertical alignment (baseline) of the text inside select and outside of it is off by 1px depending on the browser width (and height of element with the red border). Does this work in other browsers? No Chrome/Blink also have this issue. Firefox, IE11, Edge 18 (pre-Blink) doesn't have this issue. The select text still shifts there, but in sync with surrounding text so that vertical alignment is maintained