A minha dúvida de hoje prende-se com o seguinte:
Possuo uma simples tabela com três colunas, todas com nowrap em que as colunas laterais deverão ocupar o mínimo espaço possível de forma a poder acomodar o máximo de texto na coluna central.
<style type="text/css">
table {
width: 960px;
table-layout: fixed;
}
table td {
white-space: nowrap;
}
.transborda {
overflow: hidden;
/*white-space: normal*/
/*width: 100%*/
}
</style>
<body>
<table>
<tr>
<td>Coluna 1</td>
<td class='transborda'>Esta é a coluna 2 que deve ser maior que as outras todas, deve ser mesmo grande tudo de forma a criar uma tabela maior do que o desejado, assim de modos que mesmo muito grande, mas tão grande que uma pessoa olha para ela e diz: - Xi que tabela grande.</td>
<td>Esta é a terceira coluna</td>
</tr>
</table>
</body>
O texto das colunas laterais é para ser todo apresentado, enquanto na coluna central mostra-se o texto possível. Quero que a tabela mantenha os 960px de largura, quero evitar o uso de JS, pelo que o ideal seria uma solução 100% CSS...
O que já tentei:
- Se desactivar o nowrap da coluna central, a tabela fica com os 960px, mas com múltipas linhas
- Se desactivar o table-layout: fixed, a tabela cresce quanto quer, ignorando a width definida.
- Se colocar width: 100% na coluna central, ela cresce até aos 960px e sobrepõe o texto das laterais
RSS
Twitter
Facebook
