Weird UI overlay bug on Firefox


I’ve visited the CritiqueBrainz for the first time and realized some weird overlays over the titles of the work that is critiqued; thus illegible.

Browser is Mozilla Firefox 125.0.3, running on an Arch Linux (Kernel 6.8.8-arch1-1) (which is probably irrelevant). I tried running the website on Chromium as well, and there this is not happening. It’s just an insignificant bug I guess, and probably these days Firefox does not have the highest priority anymore. But maybe something for some slack time (as if anybody has those anymore :smiley: )

Edit: I just realized, that this is also happening in Chromium – my language settings where German on Firefox and English on Chromium :man_facepalming: If I switch the language to English on Firefox it is working as it is supposed to, so this is probably just an issue with the long German word; maybe possible to add some word break information? The German word wrapping points for this should look like this: ver-öf-fent-li-chungs-grup-pe


The problem seems to be with long words in general. I can confirm the behaviour with Firefox (Linux) and Edge (Windows) - if German language is selected, a “Release group” is translated to “Veröffentlichungsgruppe” → there’s no line break and the entity type is displayed over image and part of the title.
In English “Release group” has a line break and the text conceals most of small images but not the title.

1 Like

It’s not a browser bug or anything. It’s that in certain languages the labels are too long and stretch the layout. There is a ticket about this:

I had a while ago tried to add soft hyphens to the german translation specifically for “Veröffentlichungsgruppe” in MetaBrainz Weblate . But I don’t know whether this would actually work, would need to be testedt. And I think there had not been any release of CritiqueBrainz, at least none that included the translation changes.