Dado o seguinte, como faço para definir o tamanho automático da última coluna para seu conteúdo? (A última coluna deve dimensionar automaticamente a largura do conteúdo. Suponha que eu tenha apenas 1 elemento li que deve encolher vs. ter 3 elementos li etc):
<table cellspacing="0" cellpadding="0" border="0">
<thead><!-- universal table heading -->
<tr>
<td class="tc first"><input type="checkbox" value="true" name="data-1-check-all" id="data-1-check-all"></td>
<td class="tc">Type</td>
<th>File</th>
<th>Sample</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<tr>
<td>Division 1</td>
<td>Division 2</td>
<td>Division 3</td>
<td>Division 4</td>
<td>Division 5</td>
</tr>
<tr>
<td>Division 1</td>
<td>Division 2</td>
<td>Division 3</td>
<td>Division 4</td>
<td class="last">
<ul class="actions">
<li><a class="iconStats" href="#">Statystyki</a></li>
<li><a class="iconEdit" href="#">Edytuj</a></li>
<li><a class="iconDelete" href="#">Usuń</a></li>
</ul>
</td>
</tr>
</tbody>
</table>
Css:
table { table-layout: fixed; width: 100%; }
table tr { border-bottom:1px solid #e9e9e9; }
table thead td, th {border-left: 1px solid #f2f2f2; border-right: 1px solid #d5d5d5; background: #ddd url("../images/sprites4.png") repeat-x scroll 0 100% ; font-weight: bold; text-align:left;}
table tr td, th { border:1px solid #D5D5D5; padding:15px;}
table tr:hover { background:#fcfcfc;}
table tr ul.actions {margin: 0;}
table tr ul.actions li {display: inline; margin-right: 5px;}
table-layout: fixed
que seja definido no css na questão jsfiddle.net/hCkch/1.fitwidth
e, em seguida, apenas definiria a classe nas colunas que você não deseja que vão para várias linhas. Vou editar sua resposta para adicionar isso.Se você quiser ter certeza de que a última linha não vai quebrar e, portanto, dimensionar da maneira que você deseja, dê uma olhada em
fonte
Você pode especificar a largura de todas as células da tabela, exceto as últimas, e adicionar um layout de tabela: fixo e uma largura para a tabela.Você poderia definir
(ou defina isso para o último TD como Sander sugeriu).
Isso força os LIs em linha a não quebrar. Infelizmente, isso não leva a um novo cálculo de largura no UL que o contém (e neste TD pai) e, portanto, não ajusta automaticamente o último TD.
Isso significa: se um elemento embutido não tiver largura fornecida, a largura de um TD é sempre calculada automaticamente primeiro (se não for especificada). Em seguida, seu conteúdo embutido com esta largura calculada é renderizado e a
white-space
propriedade é aplicada, estendendo seu conteúdo além dos limites calculados.Então eu acho que não é possível sem ter um elemento dentro do último TD com uma largura específica.
fonte
use a largura automática e mínima ou máxima como esta:
fonte