.col-user h5, .col-user p {
margin: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
Jeśli nick się nie mieści, znika cały i zastępowany jest wielokropkiem. Na początku myślałem, że to jakiś bug i user stracił nicka. Jednak sensowniej byłoby pokazywać "ile się da" niż nic.
Widzę, że ten problem występuje na nowym FF. Na Chrom jest ok, wcześniej IMHO też było ok. Czy ten kod CSS jest błędny?
Hmm
https://stackoverflow.com/questions/46301955/text-overflow-ellipsis-hides-all-text-in-firefox
też coś piszą, ale bez wyraźnej konkluzji.
OK, problem występuje tylko, jeśli nick jest otoczony <span class="badge badge-creator">...</span>.
A to dlatego, że ten element ma display: inline-block, czyli to już nie h5 (z overflow) jest parentem dla a, tylko właśnie ten span. Bo overflow jest na rodzicu block dla dziecka inline.
Wystarczy zatem przenieść własności overflow z h5 na tego spana, by naprawić problem:
.badge {
overflow: inherit;
text-overflow: inherit;
max-width: 100%;
}
