Cuando el texto supera el tamaño de su contenedor, definido con tamaño fijo...
Desarrollo Web
Existen un par de propiedades en CSS que permiten controlar que hacer ; O mas bien como mostrar o no mostrar cuando algún texto supera el tamaño de su contenedor que esta definido con un tamaño fijo.
.text{
width: 80px;
text-overflox: ellipsis;
white-space: nowrap;
overflow: hidden;
}
Aplicando la clase anterior a un elemento HTML como un párrafo por ejemplo, el resultado será que solo mostrará el texto que cabe en el contenedor y al final del texto mostrara tres puntos ... con un resultado como el siguiente, coloca el cursor sobre el recuadro.
La propiedad clave para este resultado es la propiedad text-overflow que es la que determina el comportamiento que tendrá el texto al ser de un tamaño mayor al de su contenedor. Pero para obtener el resultado mencionado es necesario también agregar la propiedad white-space con su valor nowrap y la propiedad overflow con el valor hidden . Pero retomando la propiedad text-overflow, si cambiáramos el valor de text-overflow por clip obtendremos el siguiente resultado...
Desaparecen los tres puntos y se muestra el texto hasta donde alcanza, jugando con diferentes propiedades es posible mostrar el texto completo o hacer diferentes cosas como por ejemplo en el caso anterior mediante la propiedad hover.