Pregunta

En mi ejemplo, tengo una tabla donde cada fila es un usuario, por ejemplo. Las columnas pueden incluir su nombre, dirección, dirección de correo electrónico, etc. Ahora debo agregar una columna para (ejemplo hipotético) los nombres de sus gatos. Si bien la mayoría de las personas no tendrán gatos y algunas personas tendrán de 1 a 2 gatos, habrá una persona ocasional con 20 gatos que crean una fila muy larga en la mesa. Esto me está dando un problema en la presentación y para filtrar / buscar nombres de gatos. ¿Existe una buena solución para mostrar este tipo de datos?

¿Fue útil?

Solución

Haga que los primeros 50 caracteres (o lo que sea) del campo se muestren como normales y luego coloque el resto en un bloque con su visibilidad configurada como oculta a través de CSS. Incluya un enlace / botón / icono que le permita al usuario cambiar la visibilidad para que pueda ver el valor completo.

Otros consejos

Varias opciones:

  1. Establezca un ancho máximo para la celda y permita que los datos se ajusten
  2. Coloque el contenido dentro de una etiqueta de envoltorio (como un div) y configure el div con un ancho / alto fijo y un estilo de desbordamiento: oculto para garantizar que una palabra particularmente larga no elimine el ancho de la celda.
  3. Truncar el texto de salida en el lado del servidor

Para los casos # 2 y # 3, configure el atributo Título de la etiqueta TD para que contenga el texto completo no truncado. Esto se presentará como información sobre herramientas al pasar el cursor sobre la celda.

Mencionaría otras soluciones basadas en CSS, pero en este momento son muy poco compatibles, así que no vale la pena mencionarlas.

Es posible que desee intentar hacer algo como lo que SO hace. Es decir, una vez que alguien llega a un cierto punto en su Rep, fija el número y lo agrega. Ex. 10k en lugar de 10,236.

De esa manera los números no se salen de control.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top