columnas CSS table width: fijo - dinámico (30%) - dinámico (70%) - fijo

Question

me las arreglé para obtener este tipo de diseño de la mesa:

fijo - dinámico (50%) - dinámico (50%) - Se ha corregido

http://jsfiddle.net/ihtus/ksucU/

Pero, ¿cómo puedo obtener este tipo? fijo - dinámico (30%) - dinámico (70%) - fija

Gracias.

Answer 1

De esta manera:

<table> 
    <tr> 
     <td style="width:200px;"> 
     200px width - content 
     </td> 
     <td width="30%"> 
     dynamic width - content 
     </td> 
     <td width="70%"> 
     dynamic width - content 
     </td> 
     <td style="width:100px;"> 
     100px width - content 
     </td> 
    </tr> 
    </table> 

table { 
    width:100%; 
    border-collapse:collapse; 
    table-layout:fixed; 
} 

td { 
    border: 1px solid #333; 
} 

http://jsfiddle.net/7dSpr/

Answer 2

El enfoque general es el mismo que utiliza el Monkieboy, pero se deben evitar los estilos en línea. (con eso me refiero a escribir style="someting") en su archivo html. Deberías usar clases y CSS en su lugar.

Primero administre al td una clase como esta <td class="thin-column">text here</td>, a continuación en el uso de CSS que para aplicar estilos: .thin-column:{ width: 30% }