Na minha tabela eu defino a largura da primeira célula de uma coluna como 100px
.
Entretanto, quando o texto em uma das células desta coluna é muito longo, a largura da coluna se torna maior que 100px
. Como eu poderia desativar esta expansão?
Brinquei um pouco com ele porque tive dificuldade em descobrir.
Você precisa definir a largura da célula (ou th
ou td
trabalhada, eu defino ambas) E definir o table-layout
para fixed
. Por alguma razão, a largura da célula só parece ficar fixa se a largura da tabela também estiver definida (eu acho que'é bobagem, mas seja o que for).
Além disso, é útil definir a propriedade 'overflow' para 'ocultar' para evitar que qualquer texto extra saia da tabela.
Você deve certificar-se de deixar todos os limites e tamanhos para CSS, também.
Ok, então aqui'é o que eu tenho:
table {
border: 1px solid black;
table-layout: fixed;
width: 200px;
}
th,
td {
border: 1px solid black;
width: 100px;
overflow: hidden;
}
<table>
<tr>
<th>header 1</th>
<th>header 234567895678657</th>
</tr>
<tr>
<td>data asdfasdfasdfasdfasdf</td>
<td>data 2</td>
</tr>
</table>
[Aqui está no JSFiddle][1]
Este tipo tinha um problema semelhante: https://stackoverflow.com/q/446624/534056
Você precisa escrever isto dentro do CSS correspondente
table-layout:fixed;