Truncar cadena con puntos suspensivos - Trucos CSS

Tabla de contenido

Todo lo siguiente es obligatorio, por lo que el texto debe estar en una sola línea recta que desborde un cuadro donde se oculta ese desbordamiento.

.truncate ( width: 250px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; )

Consulte los puntos suspensivos de desbordamiento básico de Pen de Chris Coyier (@chriscoyier) en CodePen.

Tenga en cuenta el ancho fijo en uso aquí. La esencia es que el elemento necesita algún tipo de ancho determinado, por lo que debes tener especial cuidado con flexbox:

Vea el Pen Thing que debe saber sobre flexbox por Chris Coyier (@chriscoyier) en CodePen.

¿Busca truncar a un número particular de líneas?

Articulos interesantes...