1712518 - [fr-FR] "Sync and save data" text wraps in the main hamburger menu on Linux

Status: NEW

(Firefox :: Menus, defect, P3)

Description

[Zéfling]

Attachment: Screenshot_20210524_024958.png

User Agent: Mozilla/5.0 (X11; Linux x86_64; rv:90.0) Gecko/20100101 Firefox/90.0

Steps to reproduce:

Open menu in linux french version

Actual results:

The text overflows up and down.

Expected results:

The text does not overflow

Comment 1

[BugBot [:suhaib / :marco/ :calixte]]

The Bugbug bot thinks this bug should belong to the 'Firefox::Menus' component, and is moving the bug to that component. Please revert this change in case you think the bot is wrong.

Comment 2

[:Gijs (he/him)]

The wrapping is expected, but I would have expected the text to wrap while keeping a gap with the top. However, it looks like the parent container does not enlarge when the child gets bigger, and the (centered) text container (div) then ends up being clipped at the top, and overlapping the "zap" line at the bottom. Emma, did you run into this at all in bug 1698062, and/or do you have any idea on what would be a straightforward way to fix this, if any?

Comment 3

[Emma Malysz]

I'd also expect the text to wrap while keeping the gap at the top. I didn't run into that into bug 1698062, as that was more about specifying the width and wrapping, which it looks like we're doing.

I wasn't able to spot an immediate quick fix. If we specify the appMenu-fxa-status2 to overflow:auto, we fix the padding issue but clip the first row of text. It looks like we chose a padding for this element to compact the signed out state in Bug 1708501: https://searchfox.org/mozilla-central/rev/74f3c420ee54001059e1850bef3be876749ff873/browser/themes/shared/customizableui/panelUI.inc.css#896-898. Perhaps we can adjust the bottom padding there?