www.patelco.org - Text overlapping elements

[cpeterso]

URL: https://www.patelco.org/

Browser / Version: Firefox 111.0
Operating System: Windows 10
Tested Another Browser: Yes Chrome

Problem type: Design is broken
Description: Items are overlapped
Steps to Reproduce:
On my bank's website https://www.patelco.org/, the account name “123 MAIN ST” is right justified and overlaps the account balance “$123.45”, but the account name is left justified in Chrome and Safari (macOS and iOS).

Unfortunately, reproducing the bug on the site requires a bank account, but I whittled down the page's HTML to create a smaller test case that is ugly but still reproduces the bug. This bug is a regression in Firefox 104 from writing-mode bug 1323517: https://bugzilla.mozilla.org/show_bug.cgi?id=1323517

View the screenshot

Browser Configuration

• None

From webcompat.com with ❤️

[cpeterso]

Screenshot of expected behavior in Chrome:

View the screenshot

[cpeterso]

I reported this bug on Bugzilla: https://bugzilla.mozilla.org/show_bug.cgi?id=1805597. See that bug for a standalone test case.

[softvision-raul-bucata]

@cpeterso Thanks for the report. Since a banking account is needed and you have successfully reproduced the issue, I will move the issue accordingly, so further investigations can be done.

[qa_05/2023]

[ksy36]

This has been diagnosed in https://bugzilla.mozilla.org/show_bug.cgi?id=1805597, but we want to collect such issues for tracking in the webcompat knowledge base