Размер колонки table css

у меня есть таблица, в которой есть несколько колонок. В каждую ячейку записываются данные в каком то теге, например <td><div>текст</div></td> Я ставлю колонке размер 30% и всё работает отлично, до того момента, пока текст в колонке не станет очень длинным. То есть если в ячейку написать <td><div>ааааааааааааааааааааааааааааааааааа</div></td>, то даже при наличии overflow:hidden, весь этот текст будет отображен в одной строке и таблица съедет. Можно ли как то это исправить и скрыть текст, который не должен влезать?


Ответы (1 шт):

Автор решения: Проста Miha

Может это вам поможет

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

td {
  width: 30%;
  overflow: hidden;
  word-wrap: break-word;
  border: 1px solid #000;
}
<table>
  <tr>
    <td>
      <div>123</div>
    </td>
    <td>
      <div>12asdasdas12asdasdasdasdasdasdasdas3dasdasdasd12aadasdasdasdasdsdasdasdasda12asdasdasdasdasdasdasdas3sdasdasdas3asdas3</div>
    </td>
    <td>
      <div>123</div>
    </td>
  </tr>
</table>

→ Ссылка