We happen to have specially verbose category names which revealed this:
Maybe a max-width on that element? I would say it’s acceptable if the name is cropped since the full name can be seen by opening the dropdown.
1 Like
Hello Paulo,
I think it should be truncated by default. Do you use any custom css?
Edit: Yes this is in the css by default. Check your css and add this if missing.
.badge-wrapper .badge-category .category-name {
text-overflow: ellipsis;
overflow: hidden;
}
1 Like
We do have some custom CSS, but it’s pretty basic and shouldn’t affect this. Nonetheless, I disabled our custom theme using safe-mode and got the same problem.
After some more tests, I noticed that this only gets triggered depending on the available space. Changing the available viewport width, it works fine:
Or, if tags are enabled in Discourse, it’s also fine:
But, if there’s a wide space for the category field (and if tags are not enabled), then it can overlap the preview.
1 Like
I see what you mean and can repro this if delete or overwrite the max-width: 100%; in this line:
#reply-control .category-input .category-chooser {
display: flex;
flex: 1 0 auto;
max-width: 100%;
width: auto;
}
Otherwise this truncate the category name with ... at the end.
1 Like
I think I fixed this within the past month… have you updated Discourse recently?
5 Likes
My apologies, I should have checked tests-passed for this before reporting. You are right, this seems to be only present on the latest stable version so this can be closed.
1 Like