Te sugerimos que revises esta resolución en un entorno controlado antes de enviarlo a producción, saludos.
Solución:
Vieja pregunta, lo sé, pero ahora es posible usando la propiedad css table-layout: fixed en la etiqueta de la mesa. Responda a continuación de esta pregunta Ancho porcentual de CSS y desbordamiento de texto en una celda de tabla
Esto se hace fácilmente usando table-layout: fixedpero un poco complicado porque no mucha gente conoce esta propiedad CSS.
table
width: 100%;
table-layout: fixed;
Véalo en acción en el violín actualizado aquí: http://jsfiddle.net/Fm5bM/4/
De acuerdo con la definición de max-width en la especificación CSS 2.1, “el efecto de ‘min-width’ y ‘max-width’ en tablas, tablas en línea, celdas de tablas, columnas de tablas y grupos de columnas no está definido”. Por lo tanto, no puede establecer directamente el ancho máximo en un elemento td.
Si solo desea que la segunda columna ocupe como máximo el 67 %, puede establecer el ancho (que en realidad es el ancho mínimo para las celdas de la tabla) en 33 %, por ejemplo, en el caso del ejemplo
td:first-child width: 33% ;
Establecer eso para ambas columnas no funcionará tan bien, ya que tiende a hacer que los navegadores den a las columnas el mismo ancho.
Sé que esto es literalmente un año después, pero pensé en compartirlo. Estaba tratando de hacer lo mismo y encontré esta solución que funcionó para mí. Establecimos un ancho máximo para toda la tabla, luego trabajamos con los tamaños de celda para lograr el efecto deseado.
Coloque la tabla en su propio div, luego configure el ancho, el ancho mínimo y/o el ancho máximo del div según lo desee para toda la tabla. Luego, puede trabajar y establecer el ancho y los anchos mínimos para otras celdas, y el ancho máximo para el div trabajando efectivamente alrededor y hacia atrás para lograr el ancho máximo que queríamos.
#tablediv
width:90%;
min-width:800px
max-width:1500px;
.tdleft
width:20%;
min-width:200px;
Test
A long string blah blah blah
Es cierto que esto no le da un ancho “máximo” de una celda en sí, pero permite cierto control que podría funcionar en lugar de esa opción. No estoy seguro si funcionará para sus necesidades. Sé que funcionó para nuestra situación en la que queremos que el lado de navegación en la página se amplíe y reduzca hasta cierto punto, pero para todas las pantallas anchas en estos días.
valoraciones y comentarios
Más adelante puedes encontrar las aclaraciones de otros programadores, tú de igual manera puedes dejar el tuyo si te gusta.