CSS table 100% width, td width

Edit 2:

The problem seemed to be with the "bigTable" th rules. Apparently th inherited the wrong minimum width when used in a template layout. I am still investigating this.

However, I'm going to give one more try for the div. One of the big problems was using fixed navigation and dynamic content, but I already found a Holy Grail solution for this ( http://alistapart.com/article/holygrail ).

Thanks for the suggestions and all the great trollolols.

Edit:

I've reproduced this issue before http://jsbin.com/eyitij/4/edit

I have a strange problem with td table width. I have some code similar to this:

<table class="mainLayout" style="width: 100%;">
    <tr>
        <td style="width: 250px;">
            <div id="leftNavigationPanel"> * content * </div>
        </td>
        <td id="panelCell">
            <div class="panel">
                 <table id="bigTable" width="100%"> * LOTS OF CONTENT, includes big table * </table>
            </div>
        </td>
    <tr>
</table>

      

        
        
        
      

    

When I run this code in browsers, the mainLayout overflows so it becomes 3600px and this is due to the large table inside the Panel.

The large table I'm talking about can be contained in the screen. When done, it gets a horizontal scrollbar (which is what I want). This works if a large table is loaded into a separate html file with the "width: 100%" rule.

After adding the mainLayout rule "display: block;", the mainLayout table is displayed ~ 1800px and contained within the screen, but the problem is that the "panelCell" -TD is still 3400px wide, so I still have the whole page scrolling. .. TD is not contained in the table, but always expands to 250px + bigTable.width () !?

Basically the browser doesn't know how to calculate the "panelCell" just to fill it: window.width - leftNavigationPanel.

Any ideas on how to create correct rules without using the javascript + prealculated max-width rule for the "panelCell"?

• panelCell must be contained in the window
  
• bigTable must be contained inside a panelCell, with a scrollbar