I noticed this as well. To clarify, this is specific to @Johani’s component for https://meta.discourse.org/t/mobile-user-cards/105009. I’m sure he will add a fix to the component, but in the mean time, you could try:
// Prevent wrapping and hide overflow of badge names
// on mobile user cards.
#user-card .badge-display-name {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
It’s cleaner, but you do miss out on the full badge name: