title: Editable div in table exceeds its percentage-width when content is very long
body: <p>I'm using Chrome. I have a editable DIV inside a table, whose width is defined by percentage. Its CSS is as below:</p>
  
  <pre><code>div#editable {
      width:20%;
      white-space:nowrap;    
      overflow:hidden;
      border:1px solid darkgrey;
  }
  </code></pre>
  
  <p>When adding very long content into the DIV, its width begins to increase regardless of the CSS definition. Here is a demo link: <a href="http://jsfiddle.net/k5Erc/" rel="nofollow noreferrer">http://jsfiddle.net/k5Erc/</a>. You can try to input more content into the DIV and see its width growing.</p>
  
  <p>However, if its width is defined by px or em, there is no such problem. </p>
  
  <p>Could anyone tell me how to fix its width? </p>