Todos os itens a seguir são obrigatórios, portanto, o texto deve estar em uma única linha reta que transborda uma caixa onde esse estouro está oculto.
.truncate ( width: 250px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; )Veja a Pen Basic Overflow Ellipsis de Chris Coyier (@chriscoyier) no CodePen.
Observe a largura fixa em uso aqui. A essência é que o elemento precisa de algum tipo de largura determinada, com a qual você deve ser particularmente cuidadoso com o flexbox:
Veja o Pen Thing que você precisa saber sobre o flexbox de Chris Coyier (@chriscoyier) no CodePen.
Procurando truncar para um determinado número de linhas?