Come posso fare in modo che una colonna di una tabella riempia tutto lo spazio orizzontale di riserva?

Ho una tabella HTML composta da 3 colonne. Ha una larghezza fissa di 600 px.Come posso fare in modo che una colonna di una tabella riempia tutto lo spazio orizzontale di riserva?

<table> 
    <tr> 
    <td>Name</td> 
    <td>Qty</td> 
    <td>Actions</td> 
    </tr> 
</table>

Voglio la Quantità e Azioni colonne di essere il più piccolo possibile (mantenere il contenuto di una riga) e la colonna nome per prendere il resto dello spazio a disposizione. Le dimensioni della colonna Qtà e Azioni cambiano a seconda del contenuto/dimensione del carattere, quindi in questo caso le larghezze fisse non funzioneranno.

C'è un modo per farlo in HTML/CSS? O è questo qualcosa che ho bisogno di rompere il Javascript per?

fonte

2011-08-21 gsteinert

hai provato a usare nowrap? http://www.w3schools.com/tags/att_td_nowrap.asp. Si noti che l'attributo è deprecato e dovrebbe essere utilizzato con css, come specificato in questo caso –

Questo non risolve il problema principale, ovvero che le altre due celle erano troppo larghe, non troppo strette. Ma insieme alla risposta di Ranta, è esattamente quello che sto cercando, grazie – gsteinert

È possibile applicare larghezza = "99%" su quella colonna. Ad esempio:

<table> 
    <tr> 
    <td width="99%">Name</td> 
    <td>Qty</td> 
    <td>Actions</td> 
    </tr> 
</table>

fonte

2011-08-21 13:54:20 Ranta

Funziona alla grande, a patto che io usi nowrap sulle altre celle. Mi sento un po 'stupido per non averlo pensato ora. Grazie a – gsteinert

anche l'attributo width è deprecato e al suo posto dovrebbe essere usato css: http://www.w3schools.com/tags/att_td_width.asp –

Funziona bene in Firefox. Nei browser Webkit, questo squish immagini che non hanno la larghezza impostata in modo esplicito. – Arcolye

è possibile utilizzare la larghezza massima: 99%; sulla prima colonna e dare dimensioni fisse sulle altre colonne (ho usato colonne di dimensioni pixel).

<table style="width: 100%;"> 
    <tr> 
    <td style="max-width: 99%"> 
     Will max 
    </td> 
    <td style='width:110px;'> 
     fixed size here 
    </td> 
    </tr> 
</table>

fonte

2014-05-20 14:13:12

Come posso fare in modo che una colonna di una tabella riempia tutto lo spazio orizzontale di riserva?

risposta

Problemi correlati