Question

当滚动div时，表格单元格会移动，但单元格文本保持在相对于页面的相同位置。单元格文本应该与单元格一起滚动，即使它位于相对div中。

问题只能在IE（IE7至少）中看到。该示例在Chrome和Firefox中正常运行。

   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
        <title>IE Bug Demo</title> 
    </head>
    <body>
        <div style='width: 500px; height: 100px; overflow:auto'>
        <table style='width: 1000px; background-color: #ff00ff;'>
            <tr>
                <td style='border: 3px solid black'><div style='position:relative;'>One</div></td>
                <td><div style='position:relative;'>Two</div></td>
            </tr>
        </table>
        </div>
    </body>
    </html>

有什么想法吗？

Answer 1

这应该可以解决问题：

   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
        <title>IE Bug Demo</title> 
    </head>
    <body>
        <div style="width:500px;height:100px;overflow:auto;position:relative;">
        <table style="width: 1000px; background-color: #ff00ff;">
            <tr>
                <td style="border:3px solid black;"><div style="position:relative;">One</div></td>
                <td><div style="position:relative;">Two</div></td>
            </tr>
        </table>
        </div>
    </body>
    </html>

Answer 2

尝试删除位置：相对。请记住 - 避免使用html中的样式定义。将它们保存在CSS中

Answer 3

表TD中的DIV不能很好地协同工作。我会不惜一切代价避免这种加价模式。 IE和其他人处理冲突的方式存在差异很多，这只会让人头疼。

IE水平滚动问题

3 个答案: