canva.com - The "Make upgrade" button overlays on the title
Categories
(Web Compatibility :: Site Reports, defect, P2)
Tracking
(Webcompat Priority:P2, Webcompat Score:6)
People
(Reporter: railioaie, Unassigned)
References
()
Details
(Keywords: webcompat:needs-diagnosis, webcompat:needs-login, webcompat:site-report, Whiteboard: [webcompat:sightline])
User Story
platform:android impact:significant-visual configuration:general affects:all branch:release diagnosis-team:layout user-impact-score:200
Attachments
(1 file)
|
306.66 KB,
image/png
|
Details |
Environment:
Operating system: Android
Firefox version: Nightly 137.0a1-20250218093115
Preconditions:
- Clean profile
Steps to reproduce:
- Navigate to: https://www.canva.com/dream-lab
- Observe
Expected Behavior:
The title is displayed correctly
Actual Behavior:
The "Make upgrade" button overlays on the title (see attachments)
Notes:
- Reproducible on the latest Firefox Release and Nightly
- Works as expected using Chrome
- Issue found during WebCompat team [Top100] websites testing
Updated•9 months ago
|
Updated•9 months ago
|
Comment 2•8 months ago
•
|
||
Can you still reproduce this? If so, could you attach a screenshot showing the Chrome rendering on the same device?
On my Pixel 6a, Firefox and Chrome look essentially identical (with no overlap).
On Desktop with RDM, I can force overlap in Firefox as well as Chrome if I make my viewport skinny enough.
I think part of the reason you're seeing overlap on your actual phone is because the text is wider for you than it is for me -- the label at the top right is just "Upgrade" for me, whereas it's "Make Upgrade" for you which is substantially wider.
I think maybe that's because you activated translations perhaps? Your screenshot shows the translations icon in purple, in your toolbar, which indicates that some translation has been done. So I think that the translations (specifically the fact that "Make Upgrade" is a wider string than the site is expecting) is the reason for the issue here.
I'm closing as INVALID given that last paragraph, but please reopen if you are still seeing this (without artifacts introduced by translations swapping in potentially-wide text).
hi, It is not reproducible anymore. Thank you!
Description
•