Why does word-wrap not work?

Question

My word wrap doesn't work at all

<table border="1" style="width:100%"> <thead> <tr> <th>very long word</th> </tr> </thead> <tbody> <tr> <td style="word-wrap:break-word;">ablkasd/123123123/agsdfasdf/asdfasdfasdf/_sdfsdfsdf{123123-14werwwer-14124124-wefweshtsdf-235232323}/3235235/dasasdfasdfasdf.bsfs</td> </tr> </tbody> </table> 

The line is not split and is always on the same line.

I already tried all the solutions from Word Wrap not working properly but still not working

Answer 1

You need to add table-layout: fixed; to table:

 table {width:100%; table-layout: fixed;} table td {word-wrap:break-word;} 

 <table> <thead> <tr> <th>very long word</th> </tr> </thead> <tbody> <tr> <td>ablkasd/123123123/agsdfasdf/asdfasdfasdf/_sdfsdfsdf{123123-14werwwer-14124124-wefweshtsdf-235232323}/3235235/dasasdfasdfasdf.bsfs</td> </tr> </tbody> </table> 

Answer 2

Although the answer is accepted, I would like to add to the accepted answer besides

 table td {word-wrap:break-word;} 

you must make sure that the space property is not set to nowrap or pre .

This can prevent word wrap in td content even if you use word wrap: break-word

If some other CSS styles set the space property, you can add

 table td { word-wrap:break-word; white-space: normal; } 

This will ensure the correct word wrap in your td content.

Hope this helps someone!