If you have a table within a div, like so…

<div>
    <table style="width: 100%"...
    ...
    </table>
</div>

…you may experience problems with non-fixed width columns overshooting their boundaries in Internet Explorer (even IE8 under Win7).

The solution is this:

<div style="zoom: 1; overflow: auto;">
    <div id="myDiv" style="zoom: 1;">
        <table style="width: 100%"...
        ...
        </table>
    </div>
</div>

I’ve got this to work under IE8 in Win 7 x64 WITHOUT the second level div.

If you want to cater for those using IE6 or lesser, you will have to add an extra conditional. This is why I’ve left in the second level div.

<div style="zoom: 1; overflow: auto;">
    <div id="myDiv" style="zoom: 1;">
        <table style="width: 100%"...
        ...
        </table>
    </div>
</div>

<!--[if lt IE 7]><style> #myDiv { overflow: auto; } </style><![endif]-->

Why people still use IE is beyond me. Just in case you were wondering, this isn’t a “feature” or a lack of CSS implementation (of which there are many), this is a big friggin bug.

Paraphrased from: http://stackoverflow.com/questions/139000/div-with-overflowauto-and-a-100-wide-table-problem