0

position: relativeIE9で作業するのに問題があります。次のコードを使用したデモを次に示します。

<div style="overflow:scroll;height:120px;">
<table id="table"  width="100%">
    <tr style="position:relative;background-color:#1b72a4;">
        <td>fff
        </td>
         <td>fff
        </td>
         <td>fff
        </td>
         <td>fff
        </td>
         <td>fff
        </td>
         <td>fff
        </td>
    </tr>
    <tr>
        <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
    </tr>
    <tr>
        <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
    </tr>
    <tr>
        <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
    </tr>
    <tr>
        <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
    </tr>
     <tr>
        <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
    </tr>

     <tr>
        <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
    </tr>

     <tr>
        <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
         <td>data
        </td>
    </tr>

</table>
</div>

次のように最初の行にスタイルを指定して、最初の行を固定しています。style="position:relative;"

ただし、前述のスタイルはIE7でのみ機能します。IEのすべてのバージョンで最初の行を固定する必要があります。私は何をすべきか？

4

1 に答える 1

2

これはあなたが望むものですか？あなたはあなたが常に一番上に欲しいと思う最初の行を修正position: relative;していると言ったので、行くのは正しいことではありません、position: absolute;代わりに使用してください

デモ

CSS

div {
  display: inline-block;
}

#table {
   width: 600px;
}

.fixed {
   position:absolute;
   background-color:#1b72a4;
}

.fixed td {
   width: 100px;
}

#table tr:nth-child(2) td {
   padding-top: 20px;
}
于 2012-12-10T07:31:26.080 に答える