Headers wiggle at Fidelity NetBenefits when hovered or focused, due to dynamic change to 'border-bottom' on vertical-align:middle element
Categories
(Web Compatibility :: Site Reports, defect, P3)
Tracking
(Webcompat Score:1, Webcompat Priority:P3)
People
(Reporter: dholbert, Unassigned)
References
(Depends on 1 open bug, )
Details
(Keywords: webcompat:platform-bug, Whiteboard: [webcompat:sightline])
User Story
platform:windows,mac,linux impact:minor-visual affects:all
Attachments
(1 file)
456.11 KB,
video/webm
|
Details |
STR:
- Sign in to Fidelity NetBenefits.
- While signed in, visit the summary page for one particular 401k (if you've got multiple from previous employers). For me, the URL shows:
https://workplaceservices.fidelity.com/mybenefits/definedcontributions/navigation/dc/Balances
(you might be able to just directly go to that site) - Hover over the headers shown just below your company-name, which have these titles:
Summary Contributions Investments Withdrawals/Loans
Rollovers Bank/Tax Information Plan Information
ACTUAL RESULTS:
In Firefox, the text shifts upwards when you hover it or focus it (when the black bar (really a border-bottom
) appears at the bottom of the header item). Moreover: if you shrink your browser window to be skinny enough that the headers wrap to two lines (as shown in my screencast), then the whole second line grows vertically (pushing the following content downwards a bit) when an entry in that second line gets hovered or focused.
EXPECTED RESULTS:
In Chrome, the text never moves.
I've got a reduced testcase for this as testcase 3 on bug 1436801. For the nice/graceful layout without text wiggling, the browser needs to render the "BBB" and "CCC" text at the same vertical position on each line in that testcase.
Reporter | ||
Comment 1•1 year ago
|
||
Reporter | ||
Comment 2•1 year ago
|
||
I'm using:
Firefox 127.0a1 (2024-04-15) (64-bit)
Chrome 125.0.6396.3 (Official Build) dev (64-bit)
Ubuntu 22.04
Updated•1 year ago
|
Updated•8 months ago
|
Updated•6 months ago
|
Updated•5 months ago
|
Updated•5 months ago
|
Description
•