What is the distinction between overflow-wrap: break-words and word-break: break-words?
While many sources claim that there is no difference, my personal experiments suggest otherwise:
<!-- truly breaks words -->
<table style="width: 100px; border: 1px solid red">
<tr>
<td>
<div style="word-break: break-word">
hdsqdhsqydhsqgydqgsydgysqgydsqgydsgqydygsqgydsqgy
</div>
</td>
</tr>
</table>
<!-- does not fully break words -->
<table style="width: 100px; border: 1px solid red">
<tr>
<td>
<div style="overflow-wrap: break-word">
hdsqdhsqydhsqgydqgsydgysqgydsqgydsgqydygsqgydsqgy
</div>
</td>
</tr>
</table>
https://i.sstatic.net/JUkWx.png
Why does one case function correctly while the other does not?