桌子在绝对div内的高度为100％

Question

I have a table inside an absolute positioned div. The div stretches using top 0 and bottom 0, and it seems it stretches as expected cross-browser. (I checked, I put on a border on it and it stretched as expected). Now, inside the div I have a table. I want the table to stretch on all of the div space, and in Google Chrome it does. But in Internet Explorer and Firefox it is not, the table stretches to the width, but ignores the height property, and its height is determined by its contents.

Is there a way to fix it, or bypass it somehow?

Here is the code:

<div
    style=
        "position:absolute;
         top:40px;
         left:0px;
         right:0px;
        bottom:0px;">
    <table
        width="100%"
        cellpadding="0"
        cellspacing="0"
        style="height:100%;">
    </table>
</div>

Answer 1

Define a height of your div ,

<div style="position:absolute; top:40px; left:0px; right:0px; background-color: #f90; bottom:0px; height: 400px">
    <table width="100%" cellpadding="0" cellspacing="0" style="height:100%;">     
    </table>
</div>