Arrows ">" at the end of the questions are misaligned on td.com
Categories
(Web Compatibility :: Site Reports, defect, P3)
Tracking
(firefox127 affected, firefox129 affected)
People
(Reporter: ctanase, Unassigned)
References
(Depends on 1 open bug, )
Details
(Keywords: webcompat:site-report)
User Story
platform:windows,mac,linux,android impact:significant-visual configuration:general affects:all diagnosis-team:layout
Attachments
(2 files)
FF vs Chrome.png
Environment:
Operating system: Windows 10
Firefox version: Nightly 129.0a1 (2024-06-25)
Steps to reproduce:
- Go to https://www.td.com/ca/en/personal-banking/help-centre
- Observe the questions.
Expected Behavior:
The arrows/backets ">" at the end of the questions are aligned correctly.
Actual Behavior:
The arrows/backets ">" at the end of the questions are misaligned.
Notes:
- Screenshot attached
- Reproducible regardless of the ETP status
- Reproducible on Firefox Release as well
- Not reproducible on Chrome
- Issue found during WebCompat team [Top100] websites testing
|
||
Updated•4 months ago
|
|
||
Comment 1•2 months ago
|
||
This is bug 489100. The ">" arrow here is an absolutely-positioned element (an ::after pseudo-element, actually) which is positioned with respect to a relatively-positioned inline-level element that's serving as its containing block. And we're resolving bottom: 4px with respect to the first line of that inline-level element, instead of the last line (or the whole bounding box of all the lines).
|
|
||
Comment 2•2 months ago
|
||
Here's a reduced testcase. Looking at the fuchsia "ARROW" word here, it's meant to go at the end of the paragraph. In Chrome, that's where it ends up. In Firefox, it ends up at the correct x-position, but we position it vertically upwards from that point, 4px above the bottom edge of the first line of text.
Description
•