0

滚动 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>

有任何想法吗?

4

3 回答 3

2

这应该可以解决问题:

   <!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>
于 2010-03-11T15:37:35.893 回答
0

尝试删除 position:relative 。请记住 - 避免在不需要的情况下在 html 中定义样式。将它们保存在 CSS 中

于 2010-03-11T14:17:11.587 回答
0

TABLE TD 中的 DIV 不能很好地结合在一起。我会不惜一切代价避免这种标记模式。IE 和其他处理冲突的方式有很多不同,这简直是一个令人头疼的问题。

于 2010-03-11T14:47:15.683 回答