title: Table rendering issue in IE8 using break-word
body: <p>I have a table that is dynamically built based on user input--that is, the user enters the data in the table, and determines how many fields are on a row, etc.  Thus, I have no control over the length of the data, and limited control of the layout.  I've still managed to build something that works pretty well in FF, Chrome, Safari, but I'm running into an annoying problem in IE8 and IE9.  I include the following css for the table cells in question:</p>
  
  <pre><code>td.dc {
      white-space:normal;
      -ms-word-wrap: break-word;
      max-width: 80em;
  }
  </code></pre>
  
  <p>IE ignores all 3 of those tags, and continues for the whole length of the line.  If I wrap the contents of the cell in a div and apply the css to the div, it works in IE9, but still not in IE8. In IE8, the text does in fact wrap after 80 em, but the cell is still rendered wide enough to fit the unwrapped line, so everything else in the table is pushed over. Is there any way around this? </p>
  
  <p>[EDIT]  I created a jsfiddle to illustrate the particular case that's breaking: <a href="http://jsfiddle.net/qz3rv/3/" rel="nofollow noreferrer">http://jsfiddle.net/qz3rv/3/</a>  I've realized (what wasn't clear from the bug report) is that only certain cases seem broken--perhaps having to do with / in the data.</p>