Question

I found the text-wrap and overflow-wrap CSS 3 properties, but they don’t seem to do anything.

http://www.w3schools.com/cssref/css3_pr_text-wrap.asp

How to wrap text at hyphens within a table cell? Testing on Chrome 14.

Answer 1

You must use table-layout:fixed. Tested in Chrome 15 and IE7.

HTML:

<table>
  <tbody>
    <tr>
      <td>htqdrs-sdfwwwf-dfaaa-com-bbb-ccc-ddd-eee-fff-kljdfgg</td>
    </tr>
  </tbody>
</table>

CSS:

table {    
    table-layout:fixed;
    width : 50px;
    border : 1px solid #000;    
    word-wrap : break-word;
}
td {
    width : 50px;
}

JS Fiddle:
http://jsfiddle.net/9ZjCy/1/