¿Por qué mi tabla html 'max-width' no causa que el texto se ajuste?

Tengo una tabla html y una columna (o <td>) contiene palabras muy largas. Quiero establecer el ancho máximo de la columna para que, si el texto es más largo que el ancho máximo, el texto se envuelva automáticamente a la siguiente línea. Intenté establecer el estilo css max-width en el elemento <td> correspondiente con "max-width:100px", pero no funciona. El texto sigue siendo muy largo y no se ajusta automáticamente a la siguiente línea.¿Por qué mi tabla html 'max-width' no causa que el texto se ajuste?

¿Alguna idea de lo que está mal o cualquier código de referencia de solución? Estoy usando IE 8 en Windows 7.

Fuente

2010-04-17 George2

Como se especifica en [especificación css 2.1] (http://www.w3.org/TR/CSS2/visudet.html#min-max-widths): "En CSS 2.1, el efecto de 'min-width' y 'max-width' en tablas, tablas en línea, celdas de tabla, columnas de tabla y grupos de columnas no está definido." –

Debe agregar la propiedad CSS3 word-wrap: break-word;.

Fuente

2010-04-17 15:54:09 BalusC

junto con ancho máximo? – George2

@ George2 Esta propiedad css está diseñada para permitir que se rompa una palabra larga. Si resuelve tu problema, parece que a tu pregunta le faltaba un punto: tu texto no es solo largo, sino que también contiene palabras muy largas. –

Copié la pregunta para dejar en claro que el texto contenía palabras largas, no solo texto largo. – culix

El viejo ancho html td funcionará en IE 8 para eso ... Pero desea ancho máximo, no ancho ... además del atributo html adicional necesario para cada celda.

Fuente

2010-04-17 16:16:05

"Pero desea un ancho máximo, no un ancho": lo que necesito es simple, simplemente haga que el texto largo se ajuste automáticamente a la línea siguiente, de forma similar a la función de ajuste automático del bloc de notas. Alguna solución? – George2

Sí, y la solución dada por alguien de arriba será suficiente. (Tengo que comprobar IE8, como supongo que es su objetivo) Obviamente, css3 no se aplicará en IE6, seguro. Mi solución funciona, pero no es flexible, necesitas ancho fijo en tds y probablemente también en la mesa. Lo cual no es divertido break-word que mencionó es la única manera si lo que intentas romper son palabras, las propiedades antiguas de css no romperán, por ejemplo, las cadenas clave de registro largas sin espacios. De todos modos, css más antiguo para envolver: http://www.w3schools.com/css/pr_text_white-space.asp http://www.quirksmode.org/css/whitespace.html (tabla de compatibilidad de navegadores) –

Otra solución que he usado a veces es incrustada dentro de un div o span (con pantalla: bloquear o no, dependiendo de lo que se necesite), a la que aplico todas las propiedades ... puede ser el truco, en algunos casos. –

Puede colocar un div dentro de las celdas de su tabla.

Nada dentro de ese div estirará la celda de la tabla.

Funciona muy bien en IE8 y Chrome al menos.

Fuente

2011-06-13 23:20:53 Ondross

En el caso de palabras largas, agregar el ajuste de palabras: palabra de ruptura; será requerido. En el caso de tablas de ancho fijo, el contenido interno de la celda puede ser aún más ancho que el ancho máximo especificado en el div, pero el texto se ajustará según el ancho del div, lo que ocasionará una pérdida de espacio. Por lo tanto, su solución está limitada a tablas de ancho no fijo. –

<td nowrap="wrap" style="width:100px;"></td>

Todos los navegadores ..

Desafortunadamente tienen que manejar cada célula de contenido para mantener a toda la anchura fija mesa. Hay un atributo de ancho para, pero no controla nada.

Fuente

2012-03-13 13:04:10 tjcoder

¿Por qué mi tabla html 'max-width' no causa que el texto se ajuste?

Respuesta

Cuestiones relacionadas