Chrome doesn't render div or span revisited

I've been googling and grepping for a while. Haven't found a solution yet. I'm attaching some sample html. This is generated by a third party package that is used in DNN. Chrome fails to display the element as noted. IE9 and FF are fine. Any comments appreciated.

<div>
    <table align="left" sizcache="18" sizset="196" style="height: 100%;">
          <tbody sizcache="18" sizset="196">
              <tr>
                <td>
                   <span>
                   I can see this element... 
                   </span>
                </td>
             </tr>
             <tr>
                <td colspan="2">
                    <div style="开发者_运维技巧width: 100%; height: 100%; overflow-x: auto; overflow-y: auto;">
                        <span style="width: 450px; height: 100px; display: inline-block;">
                        You can see me in IE9, Firefox, but not Chrome!!! 
                        </span>
                    </div>
                </td>
            </tr>
            <tr>
                <td style="height: 10px;" colspan="2">
                ... and this element.
                </td>
            </tr>
        </tbody>
    </table>
</div>

Just get rid of the two overflows in your div style. http://jsfiddle.net/zeuFT/1/

The div is set to height: 100%;, but the parent has no height defined, so it's 100% of nothing.

Adding a height to the parent td will show the div.

http://jsfiddle.net/2msKf/2/

i think that the problem is incorect HTML. Please observe that there is only 1 TD in each row, but the TD with div that is not being displayed has colspan="2" .. i believe that chrome cannot handle this