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 に答える