title: Table cells have no height when they have the attribute contentEditable, but no data in the cell
body: <p>I have an html table that autosizes.  The table has an extra row at the bottom with its  elements containing the contentEditable="true" attribute.</p>
  
  <p>When none of the cells in the row of contentEditable="true" cells have any value, the row has almost no height.  Conversely, if any cell in the row of contentEditable="true" cells has any value, then all of the cells in that row display with the height of the rows above it.</p>
  
  <p>Here's the fiddle that shows my issue.  <a href="http://jsfiddle.net/bjsfiddle/4mVgg/" rel="nofollow noreferrer">http://jsfiddle.net/bjsfiddle/4mVgg/</a> 
  The first table below has a "." character in the first cell that has the contentEditable="true" set.  This row displays properly: </p>
  
  <pre><code>&lt;h4&gt;Table where last line can be edited&lt;/h4&gt;
  &lt;h5&gt;(the contenteditable row has a "." in the name field&lt;/h5&gt;
  &lt;table border="1"&gt;
  &lt;tr&gt;
    &lt;th&gt;Name&lt;/th&gt;
    &lt;th&gt;Address&lt;/th&gt;
    &lt;th&gt;Telephone&lt;/th&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
    &lt;td&gt;Billy Byte&lt;/td&gt;
    &lt;td&gt;999 MyStreet&lt;/td&gt;
    &lt;td&gt;555 777 8558&lt;/td&gt;
  &lt;/tr&gt;
  &lt;tfoot&gt;
      &lt;td contenteditable="true"&gt;&lt;div&gt;.&lt;/div&gt;&lt;/td&gt;
      &lt;td contenteditable="true"&gt;&lt;div&gt;&lt;/div&gt;&lt;/td&gt;
      &lt;td contenteditable="true"&gt;&lt;div&gt;&lt;/div&gt;&lt;/td&gt;
  &lt;/tfoot&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>The second table below does not have the "." character in any contentEditable field, and the height
  of that table row is extremely small.  See below:</p>
  
  <pre><code>&lt;h4&gt;Same Table, no "." in the Name field&lt;/h4&gt;
  &lt;table border="1"&gt;
  &lt;tr&gt;
    &lt;th&gt;Name&lt;/th&gt;
    &lt;th&gt;Address&lt;/th&gt;
    &lt;th&gt;Telephone&lt;/th&gt;
  &lt;/tr&gt;
  &lt;tr&gt;
    &lt;td&gt;Billy Byte&lt;/td&gt;
    &lt;td&gt;999 MyStreet&lt;/td&gt;
    &lt;td&gt;555 777 8558&lt;/td&gt;
  &lt;/tr&gt;
  &lt;tfoot&gt;
      &lt;td contenteditable="true"&gt;&lt;div&gt;&lt;/div&gt;&lt;/td&gt;
      &lt;td contenteditable="true"&gt;&lt;div&gt;&lt;/div&gt;&lt;/td&gt;
      &lt;td contenteditable="true"&gt;&lt;div&gt;&lt;/div&gt;&lt;/td&gt;
  &lt;/tfoot&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>I'm sure it's probably something simple, but I just can't seem to find the answer.
  Thanks much for any help</p>