12Jul

Únicamente con CSS, podemos cortar el texto al final de la anchura del contenedor de un elemento cualquiera

Para que el texto quede recortado al final de la anchura del contenedor y en la presentación al usuario se añada automáticamente «…» al final de la cadena de texto basta con aplicar en el contenedor las siguientes normas de CSS:

elipsis.css

.text-elipsis {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

Gist: Código CSS para la aplicación de elipsis en el texto

Leave a comment