none
请教一个CSS问题 RRS feed

  • 问题

  • 我原来的应用中左边栏可以隐藏,隐藏左边栏后,数据表格自动左移;展开后,数据表格自动右移。在IE9以前版本都没问题,但在IE10中,如果展开左边栏,数据表格不是贴着左边栏显示,而是跑到了左边栏下边,过去在其他浏览器也发现过此问题,但因为客户只要求支持IE,就没关注。请教各位大师这个问题该如何解决好?

    下面是CSS代码,tablescroll是数据表格区,表头和左边列固定。

    /*----------------------------------------------------------
     边框
    ----------------------------------------------------------*/
    .tablescroll
    {
        border: 1px solid #000;
        width: 100%;
        height: 370px;
        overflow: auto;
    }
    h3
    {
       
        text-align:center;
       
    }


    /*----------------------------------------------------------
     第一行 列头
    ----------------------------------------------------------*/
    .tablescroll table thead tr
    {
    ;
    top: expression(this.offsetParent.scrollTop);
    }

    /*----------------------------------------------------------
     做上角
    ----------------------------------------------------------*/
    .tablescroll table thead tr th
    {
    ;
    left: expression(this.parentElement.offsetParent.scrollLeft);

    background-color:#efefef;
    }

    .tablescroll table thead tr td
    {
        cursor:pointer;
        text-align:center;
    background-color:#efefef;
        }
       
    .tablescroll table thead tr th
    {
        cursor:pointer;
        text-align:center;
        }
       
    /*----------------------------------------------------------
     第一列 行头
    ----------------------------------------------------------*/
    .tablescroll table tbody tr th
    {
    ;
    left: expression(this.parentElement.offsetParent.parentElement.scrollLeft);           
    background-color:#efefef;
    }


    .tablescroll table thead td
    {
        padding: 5px;
        border-right: 1px solid #ccc;
        border-bottom: 1px solid #ccc;
        font-size: smaller;
        font-weight:normal;
        white-space:nowrap;
    }

    .tablescroll table tbody tr:hover
    {
         background-color:Blue;
        }

    .tablescroll table th
    {
    padding:5px;
     border-right:1px solid #ccc;
    border-bottom: 1px solid #ccc;
    font-size:smaller;
     font-weight:normal;
        white-space:nowrap;
    }
           
    .tablescroll table td
    {
        padding: 5px;
        border-right: 1px dotted #ccc;
        border-bottom: 1px dotted #ccc;
        font-size: smaller;
        text-align:center;
        white-space:nowrap;
    }

    .tableTitle
    {
        border-right:1px solid #000;
        border-left:1px solid #000;
        border-top:1px solid #000;
       
        width: 100%;
        overflow: auto;
        padding:5px;
       
        text-align:center;
        vertical-align:middle;
        font:20;
        }
       
        .tablescroll table a
    {
        color: Blue;
        text-decoration: underline;
    }

    2013年6月8日 8:49

全部回复