Word-wrap em uma tabela HTML

Eu tenho usadoword-wrap: break-word para quebrar o textodivareiaspans. No entanto, parece não funcionar nas células da tabela. Eu tenho uma mesa parawidth:100%, com uma linha e duas colunas. Texto em colunas, embora estilizado com o acimaword-wrapnão embrulha. Faz com que o texto ultrapasse os limites da célula. Isso acontece no Firefox, no Google Chrome e no Internet Explorer.

Aqui está a aparência da fonte:

td {
  border: 1px solid;
}
<table style="width: 100%;">
  <tr>
    <td>
      <div style="word-wrap: break-word;">
        Looooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooong word
      </div>
    </td>
    <td><span style="display: inline;">Short word</span></td>
  </tr>
</table>

A palavra longa acima é maior que os limites da minha página, mas não quebra com o HTML acima. Eu tentei as sugestões abaixo de adicionartext-wrap:suppress etext-wrap:normal, mas nem ajudou.

questionAnswers(20)

yourAnswerToTheQuestion