html修复标题firefox最新浏览器兼容

时间:2012-07-16 15:08:05

标签: html css firefox

我希望在Firefox 3.6中使用固定标头,但在Firefox 13中则不行。

css也被喂食了,我觉得必须要对ID scrollTableContainer做些什么。

表格

<thead>

    <tr>

        <th>Rendering engine</th>
        <th>Browser</th>
        <th>Platform(s)</th>
        <th>Engine version</th>
        <th>CSS grade</th>
    </tr>

</thead>
<tbody>
    <tr class="odd gradeX">
        <td>Trident</td>
        <td>Internet
             Explorer 4.0</td>
        <td>Win 95+</td>
        <td class="center">4</td>

        <td class="center">X</td>
    </tr>
    <tr class="odd gradeC">
        <td>Trident</td>
        <td>Internet
             Explorer 5.0</td>
        <td>Win 95+</td>
        <td class="center">5</td>

        <td class="center">C</td>
    </tr>

         </tbody>
      </table>
   </div>

            **CSS BELOW** 



     div.scrollTableContainer 
    {
        height: 485px;
        overflow: auto;
        width: auto;
        margin: 10px -75px 1px -50px;
        position: relative;
    }

    /* The different widths below are due to the way the scroll bar is implimented */

    /* All browsers (but especially IE) */
    div.scrollTableContainer table 
    {
    width: 1000px;

    }

    /* Modern browsers (but especially firefox ) */
    html>/**/body div.scrollTableContainer table 
    {
    width: 1000px;
    }

    /* Modern browsers (but especially firefox ) */
    html>/**/body div.scrollTableContainer table>tbody 
    {
    overflow: auto;
    height: 365px;
    overflow-x: hidden;
    max-width:100px;

    }



             div.scrollTableContainer thead tr {
      position:relative;
      background-color:#3366FF;
      width:auto;
      text-align:left;
      top: expression(offsetParent.scrollTop); /*IE5+ only*/
      /* fixes the header being over too far in IE, doesn’t seem to affect FF */
      left: 0px;   
      }

      /*prevent Mozilla scrollbar from hiding cell content*/
      div.scrollTableContainer td:last-child {padding-right: 20px;}
      /*********************************************************************************/
      /* Used specifically for View Announcements page in Samo */
      div.scrollTableContainerAnn 
      {
        height:485px;
        overflow: auto;
        width: auto;
        margin: 10px -225px 1px -50px;
        position: relative;
      }

      /* The different widths below are due to the way the scroll bar is implemented */

      /* All browsers (but especially IE) */
      div.scrollTableContainerAnn table 
      {
        width: 1000px;
      }

      /* Modern browsers (but especially firefox ) */
      html>/**/body div.scrollTableContainerAnn table 
      {
        width: 1000px;
      }

      /* Modern browsers (but especially firefox ) */
      html>/**/body div.scrollTableContainerAnn table>tbody 
      {
        overflow: auto;
        height: 365px;
        overflow-x: hidden;
        max-width:100px;
      }

      div.scrollTableContainerAnn thead tr 
      {
        position:relative;
        background-color:#3366FF;
        width:auto;
        text-align:left;

        top: expression(offsetParent.scrollTop); /*IE5+ only*/
        /* fixes the header being over too far in IE, doesn't seem to affect FF */
        left: 0px;
      }

      /*prevent Mozilla scrollbar from hiding cell content*/
      div.scrollTableContainerAnn td:last-child 
      {
        padding-right: 20px;
      }
      /*********************************************************************************/

      /* CSS Document */
      div.scrollTableContainerB {
      height: 500px;
      overflow: auto;
      width: auto;
      margin: 10px -75px 1px -75px;
      position: relative;
      }

      /* The different widths below are due to the way the scroll bar is implimented */

      /* All browsers (but especially IE) */
      div.scrollTableContainerB table {
      width: 1110px;

      }

      /* Modern browsers (but especially firefox ) */
      html>/**/body div.scrollTableContainerB table {
      width: 900px;
      }

      /* Modern browsers (but especially firefox ) */
      html>/**/body div.scrollTableContainerB table>tbody {
      overflow: auto;
      height: 365px;
      overflow-x: hidden;   
      max-width:100px;

      }

      div.scrollTableContainerB thead tr {
      position:relative;
      background-color:#3366FF;
      width:800px;
      text-align:left;
      top: expression(offsetParent.scrollTop); /*IE5+ only*/
      /* fixes the header being over too far in IE, doesn’t seem to affect FF */
      left: 0px;
      }

      /*prevent Mozilla scrollbar from hiding cell content*/
      div.scrollTableContainerB td:last-child {padding-right: 20px;}

0 个答案:

没有答案