Cutted off font on Facebook in Firefox

[Konrad Kołodziejczyk]

The domain of site is cutted off on Facebook site as it is seen on this screenshot.
https://i.postimg.cc/44Bt3H7j/Zrzut-ekranu-z-2020-06-06-00-07-36.png
I've seen this problem in Ubuntu 20.04 and I haven't seen in Ubuntu 19.10. This issue is merely in Firefox. Facebook site in Google Chrome looks ok.

ProblemType: Bug
DistroRelease: Ubuntu 20.04
Package: firefox 77.0.1+build1-0ubuntu0.20.04.1
ProcVersionSignature: Ubuntu 5.4.0-33.37-generic 5.4.34
Uname: Linux 5.4.0-33-generic x86_64
AddonCompatCheckDisabled: False
ApportVersion: 2.20.11-0ubuntu27.2
Architecture: amd64
AudioDevicesInUse:
 USER PID ACCESS COMMAND
 /dev/snd/controlC1: konrad 1159 F.... pulseaudio
 /dev/snd/pcmC1D0p: konrad 1159 F...m pulseaudio
 /dev/snd/controlC0: konrad 1159 F.... pulseaudio
BuildID: 20200602222727
CasperMD5CheckResult: skip
Channel: Unavailable
CurrentDesktop: MATE
Date: Sat Jun 6 00:05:28 2020
DefaultProfileExtensions: extensions.sqlite corrupt or missing
DefaultProfileIncompatibleExtensions: Unavailable (corrupt or non-existant compatibility.ini or extensions.sqlite)
DefaultProfileLocales: extensions.sqlite corrupt or missing
DefaultProfilePrefErrors: Unexpected character ',' before close parenthesis @ /usr/lib/firefox/omni.ja:greprefs.js:731
DefaultProfilePrefSources: /usr/lib/firefox/defaults/pref/all-ubuntumate.js
DefaultProfileThemes: extensions.sqlite corrupt or missing
ForcedLayersAccel: False
IfupdownConfig:
 # interfaces(5) file used by ifup(8) and ifdown(8)
 # Include files from /etc/network/interfaces.d:
 source-directory /etc/network/interfaces.d
InstallationDate: Installed on 2020-06-05 (0 days ago)
InstallationMedia: Ubuntu-MATE 20.04 LTS "Focal Fossa" - Release amd64 (20200423)
IpRoute:
 default via 192.168.0.1 dev wlp2s0 proto dhcp metric 600
 169.254.0.0/16 dev wlp2s0 scope link metric 1000
 192.168.0.0/24 dev wlp2s0 proto kernel scope link src 192.168.0.8 metric 600
Profile0Extensions: extensions.sqlite corrupt or missing
Profile0IncompatibleExtensions: Unavailable (corrupt or non-existant compatibility.ini or extensions.sqlite)
Profile0Locales: extensions.sqlite corrupt or missing
Profile0PrefErrors: Unexpected character ',' before close parenthesis @ /usr/lib/firefox/omni.ja:greprefs.js:731
Profile0PrefSources:
 /usr/lib/firefox/defaults/pref/all-ubuntumate.js
 prefs.js
Profile0Themes: extensions.sqlite corrupt or missing
Profiles:
 Profile1 (Default) - LastVersion=None/None (Out of date)
 Profile0 - LastVersion=77.0.1/20200602222727 (In use)
RunningIncompatibleAddons: False
SourcePackage: firefox
UpgradeStatus: No upgrade log present (probably fresh install)
dmi.bios.date: 11/25/2019
dmi.bios.vendor: Dell Inc.
dmi.bios.version: A23
dmi.board.name: 0V8RX3
dmi.board.vendor: Dell Inc.
dmi.board.version: A00
dmi.chassis.type: 9
dmi.chassis.vendor: Dell Inc.
dmi.modalias: dmi:bvnDellInc.:bvrA23:bd11/25/2019:svnDellInc.:pnLatitudeE7250:pvr:rvnDellInc.:rn0V8RX3:rvrA00:cvnDellInc.:ct9:cvr:
dmi.product.name: Latitude E7250
dmi.product.sku: 062D
dmi.sys.vendor: Dell Inc.

[Olivier Tilloy (osomon)]

That looks like an upstream rendering issue. Would you mind filing a bug at https://bugzilla.mozilla.org/enter_bug.cgi#h=dupes%7CFirefox and sharing the link to it here? Thanks!

[Konrad Kołodziejczyk (krejzus)]

Created attachment 9154965
Zrzut-ekranu-z-2020-06-06-00-07-36.png

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

Steps to reproduce:

I've opening Facebook site in Firefox on Ubuntu 20.04, Ubuntu MATE 20.04 and Xubuntu 20.04.

Actual results:

The domain of site is cutted off on Facebook site as it is seen on attached screenshot.
https://i.postimg.cc/44Bt3H7j/Zrzut-ekranu-z-2020-06-06-00-07-36.png
I've seen this problem in Ubuntu 20.04, Ubuntu Mate 20.04, Xubuntu 20.04 and I haven't seen in Ubuntu 19.10 and Windows 10. This issue is merely in Firefox. Facebook site in Google Chrome looks ok.

I've reported this issue also on launchpad.
https://bugs.launchpad.net/bugs/1882309

[Konrad Kołodziejczyk (krejzus)]

I've reported it on bugzilla.
https://bugzilla.mozilla.org/show_bug.cgi?id=1644178

[Release-mgmt-account-bot (release-mgmt-account-bot)]

[Bugbug](https://github.com/mozilla/bugbug/) thinks this bug should belong to this component, but please revert this change in case of error.

[Jfkthame (jfkthame)]

It looks like the site there is styled with `font-size:12px` and `line-height:11px` (and `overflow:hidden`); the exact results will depend on the font that's used, its baseline alignment within the available line height, etc., but having `line-height` *smaller* than `font-size` seems like it's asking for trouble.

Having said that, I'm not seeing this on my Ubuntu 18.04 system, with any of several possible sans-serif fonts. What font is Ubuntu 20.04 using here?

[Aethanyc (aethanyc)]

Set [S4](https://wiki.mozilla.org/Platform/Layout/Triage#S4_.28Small.2FTrivial.29) as this is a cosmetic issue related to site design and the font used.

[Konrad Kołodziejczyk (krejzus)]

(In reply to Jonathan Kew (:jfkthame) from comment #2)
> It looks like the site there is styled with `font-size:12px` and `line-height:11px` (and `overflow:hidden`); the exact results will depend on the font that's used, its baseline alignment within the available line height, etc., but having `line-height` *smaller* than `font-size` seems like it's asking for trouble.
>
> Having said that, I'm not seeing this on my Ubuntu 18.04 system, with any of several possible sans-serif fonts. What font is Ubuntu 20.04 using here?

How to check it?

[Jfkthame (jfkthame)]

You can find out what font is used for a particular element using the Inspector. Right-click on the element in question and choose Inspect Element from the menu, then in the Inspector look at the Fonts panel on the right-hand side (it's one of the options for the section that offers Layout / Computed / Changes / etc.) Note that you may have to use the popup menu at the far right to switch to the Fonts panel, if the window isn't wide enough for it to show its heading by default. This should show the font (or fonts) used for the element.

[Konrad Kołodziejczyk (krejzus)]

Whole facebook use font Nimbus Sans (NimbusSans-Regular) but cutted off text is merely at 12px font size.

[Vseerror (vseerror)]

(In reply to Jonathan Kew (:jfkthame) from comment #2)
> It looks like the site there is styled with `font-size:12px` and `line-height:11px` (and `overflow:hidden`); the exact results will depend on the font that's used, its baseline alignment within the available line height, etc., but having `line-height` *smaller* than `font-size` seems like it's asking for trouble.
>
> Having said that, I'm not seeing this on my Ubuntu 18.04 system, with any of several possible sans-serif fonts. What font is Ubuntu 20.04 using here?

[Release-mgmt-account-bot (release-mgmt-account-bot)]

Redirect a needinfo that is pending on an inactive user to the triage owner.
:jfkthame, since the bug has recent activity, could you have a look please?

For more information, please visit [auto_nag documentation](https://wiki.mozilla.org/Release_Management/autonag#inactive_ni_pending.py).

[Konrad Kołodziejczyk (krejzus)]

I don't see this problem in the Ubuntu 20.04 and Ubuntu 22.04.

[Konrad Kołodziejczyk (krejzus)]

Furthermore, Facebook have new interface since then.

[Jfkthame (jfkthame)]

It looks like this may have been an issue with the Facebook CSS vs some particular font that didn't fit well in the allocated space, but the reporter is no longer seeing the issue -- closing as WFM.

[Paul White (paulw2u)]

Further to comment #15 I'll close this as not a Firefox issue.