2012-01-09 23 views
6

¿Hay alguna manera de tener la primera columna izquierda para tener un ancho mínimo ... como el 50%.Ancho mínimo de la primera columna de la tabla

Tengo una cantidad variada de tablas separadas (con diferentes encabezados, por lo que son datos separados).

Obviamente, las columnas de la tabla cambian su ancho de acuerdo con la cantidad de contenido que contienen ... si necesita más espacio, tomará más espacio de otras columnas en la misma tabla ... eso es genial, pero cuando hay mucha espacio y no necesita ningún espacio extra, entonces su mucho más ordenado si todos ellos sólo se quedan el mismo ancho ... como 50%

http://jsfiddle.net/mqatP/5/

alguna idea de cómo hacer esto sin pruebas en PHP la cantidad de contenido va dentro de ellos y agrega diferentes clases?

Gracias, Dom

Respuesta

5

Me sorprendió descubrir que min-width no hace t almiar. Sin embargo, después de jugar con él por un tiempo, me encontré con esta solución:

td:first-child { 
    width: 40%; 
    white-space: nowrap; 
} 
+0

Esto parece ser bastante fresco. Incluso ancho: el 50% también funcionó. Entonces los mantiene alineados si hay suficiente espacio y usa el espacio si lo tiene. A veces tengo 3 columnas que las estropean, pero dudo que puedan repararse sin una col-2, col-3 y diferentes estilos por. –

+0

Aunque, si tiene un texto que es demasiado largo, se desborda en lugar de envolverse ... pero supongo que no hay realmente una salida de eso –

2

Yo sugeriría a probar esta para fijar el ancho de la tabla en CSS

table-layout:fixed; 

y en la sintaxis de JavaScript es: object.style.tableLayout="fixed"

+0

supongo que esta es la solución más limpia, pero las fuerzas de envasado una vez que haya espacio que podría utilizar –

1

usted podría utilizar

tbody>tr>td:nth-child(1), 
tbody>tr>td:nth-child(2), 
tbody>tr>td:nth-child(3) { width: 50%; } 
Cuestiones relacionadas