"This commit is contained in" overflows the box

[colejohnson66]

Description

As shown in the screenshot below, the "this commit is contained in" list overflows the summary box.

Gitea Version

1.21.4

Can you reproduce the bug on the Gitea demo site?

Untested

Log Gist

No response

Screenshots

Git Version

No response

Operating System

No response

How are you running Gitea?

Service on Windows Server

Database

MySQL/MariaDB

[silverwind]

Maybe we should try a overflow-wrap: anywhere global CSS rule to fix these issues once and for all, but may have side-effects on elements that do not expect their content to wrap.

[colejohnson66]

It's in a flexbox, so adding overflow-warp:anywhere to the div.tag-area element does this:

I don't know about you, but, to me, that's worse. Maybe replacing the list with an inline ul would be a better option.

[silverwind]

Right, in this case the correct solution will be flex-wrap: wrap on the parent node.

And sadly, it already highlights why we can't have global overflow-wrap: anywhere.

[colejohnson66]

flex-wrap: wrap does indeed fix the issue:

[delvh]

The funny thing is: I originally designed the box so that it should already do that (compare with the screenshot in #25180).
I thought I designed it resilient enough not to have this type of problem, but apparently something else must have changed in the meantime…