如何控制 Firefox 中表格单元格的溢出？

我有一个表格，希望第一列有一个垂直滚动条。这在 Chrome、IE9、iPad 上的 Safari 中有效，但在 Firefox 中无效？为什么不？我究竟做错了什么？

HTML:

    <table>
        <tbody>
            <tr>
                <td class="col1">
                    <div class="wrapper">
                        <p>Test</p>
                        <p>Test</p>
                        <p>Test</p>
                        <p>Test</p>
                        <p>Test</p>
                        <p>Test</p>
                        ...
                    </div>
                </td>
                <td class="col2">
                </td>
            </tr>
        </tbody>
    </table>

CSS:

html, body {
margin: 0;
padding: 0;
height: 100%;
width: 100%;
}

table {
width: 100%;
height: 100%;
}

table .col1 {
width: 20%;
height: 100%;
}

table .col1>div.wrapper {
width: 100%;
height: 100%;
overflow: auto; 
}

table .col2 {
width: 80%;
height: 100%;
background-color: red;
}

问题：

overflow:scroll;不能在 a 内工作table.

如果你对 a 做同样的事情div，然后就可以正常工作了。

See 实例 http://jsfiddle.net/WX8Jj/

Example:

HTML

<div class="col1" >
    <div class="wrapper">
        <p>Test</p>
        <p>Test</p>
        <p>Test</p>
        <p>Test</p>
        <p>Test</p>
    ...
    </div>
</div><div class="col2">
</div>

更多阅读：http://lists.w3.org/Archives/Public/www-style/2006Mar/0030.html#replies http://lists.w3.org/Archives/Public/www-style/2006Mar/0030.html#replies

谢谢kirtan https://stackoverflow.com/users/83664/kirtan