HTML/CSS "Truncamiento receptivo"

Question

Recientemente lanzé una versión receptiva de mi sitio, sin embargo, descubro que las divisiones de ancho porcentuales que contienen una serie de líneas de texto individuales se ven realmente mal, ya que se ajusta todo en una sola línea en el escritorio y las vistas móviles da como resultado en cada línea. de texto es demasiado largo o demasiado corto.

Mi marcado es una única lista desordenada de enlaces (con textos de anclaje largos): ¿alguien tiene alguna sugerencia para truncar el texto de anclaje de acuerdo con el ancho de la división que contiene?

Answer 1

Puedo encontrar dos opciones:

Una es hacerlo usted mismo usando JavaScript como se describe aquí:

Calcular el ancho del texto con JavaScript

No creo que haya alguna forma de determinar el ancho del texto hasta que el navegador realmente rinda el texto.

Asegúrese de no mostrar: ninguno, o el navegador en realidad no lo representa y no puede determinar el ancho.

El segundo es dejar que CSS lo haga por usted; Es más fácil, pero pierdes casi toda flexibilidad:

Si está dispuesto a dejar que CSS adivine cómo cortar su texto en ellipsis, puede probar el texto de texto: Ellipsis

http://www.quirksmode.org/css/textoverflow.html