各位css和js高手帮忙看看，怎么实现当外层div横向滚动的时候，里面嵌套的div滚动条靠边（宽度始终最大）？在线等！！！

<html>
<head>    <script type="text/javascript">
function scroll()
{
    var divbody = document.getElementById('divbody');
    //divbody.style.margin = "0";
   // divbody.style.width="100%";
    //该怎样实现，
}
    </script>    <style type='text/css'>
        .divContainer
        {
            margin-top: 50PX;
            margin-left: 50PX;
            width: 500px;
            height: 238px;
            overflow-x: auto;
            overflow-y: hidden;
            border:solid 1 silver;
        }
        .divhead
        {
            height: 43px;
            width: 100%;
        }
        .tablehead
        {
            border-collapse: collapse;
            table-layout: fixed;
            border: solid 1px silver;
        }
        .tablehead td
        {
            border: solid 1px Silver;
        }
        .trhead2
        {
            background-color: #D2EEFC;
            border: solid 1px Silver;
            white-space: nowrap;
        }
        .divbody
        {
            height: 178px;
            overflow-x: hidden;
            overflow-y: scroll;
            margin-bottom: 15px;
            width: 100%;
        }
        .tablebody
        {
            border-collapse: collapse;
            table-layout: fixed;
            border: solid 1px Silver;
        }
        .style1
        {
            width: 37px;
            text-align: center;
            border: solid 1px Silver;
        }
        .style2
        {
            width: 92px;
            text-align: center;
            white-space: normal;
            border: solid 1px Silver;
        }
        .style3
        {
            width: 61px;
            text-align: center;
            border: solid 1px Silver;
        }
        .style6
        {
            width: 90px;
            height: 40px;
            border: solid 1px Silver;
            white-space: nowrap;
        }
    </style>
</head>
<body>
    <div class='divContainer' onscroll='scroll()'>
        <div class='divhead'>
            <table class='tablehead'>
                <tr class='trhead2'>
                    <td class='style1'>序号</td><td class='style2'>单位</td> <td class='style3'>                       姓名
                    </td>
                    <td class='style6'>
                        test1
                    </td>
                    <td class='style6'>
                        test2
                    </td>
                    <td class='style6'>
                        test3
                    </td>
                    <td class='style6'>
                        test4
                    </td>
                    <td class='style6'>
                        test5
                    </td>
                    <td class='style6'>
                        test6
                    </td>
                    <td class='style6'>
                        test7
                    </td>
                    <td class='style6'>
                        test8
                    </td>
                    <td class='style6'>
                        test9
                    </td>
                    <td class='style6'>
                        test10
                    </td>
                </tr>
            </table>
        </div>
        <div id='divbody' class='divbody'>
            <table class='tablebody'>
                <tr><td class='style1'>序号1</td><td class='style2'>单位2</td><td class='style3'>姓名1</td>
                    <td class='style6'>test1</td><td class='style6'>test2</td><td class='style6'>test3</td>
                    <td class='style6'>test4</td><td class='style6'>test5</td><td class='style6'>test6</td>
                    <td class='style6'>test7</td><td class='style6'>test8</td><td class='style6'>test9</td>
                </tr>
                <tr><td class='style1'>序号1</td><td class='style2'>单位2</td><td class='style3'>姓名1</td>
                    <td class='style6'>test1</td><td class='style6'>test2</td><td class='style6'>test3</td>
                    <td class='style6'>test4</td><td class='style6'>test5</td><td class='style6'>test6</td>
                    <td class='style6'>test7</td><td class='style6'>test8</td><td class='style6'>test9</td>
                </tr>
                <tr><td class='style1'>序号1</td><td class='style2'>单位2</td><td class='style3'>姓名1</td>
                    <td class='style6'>test1</td><td class='style6'>test2</td><td class='style6'>test3</td>
                    <td class='style6'>test4</td><td class='style6'>test5</td><td class='style6'>test6</td>
                    <td class='style6'>test7</td><td class='style6'>test8</td><td class='style6'>test9</td>
                </tr>
                <tr><td class='style1'>序号1</td><td class='style2'>单位2</td><td class='style3'>姓名1</td>
                    <td class='style6'>test1</td><td class='style6'>test2</td><td class='style6'>test3</td>
                    <td class='style6'>test4</td><td class='style6'>test5</td><td class='style6'>test6</td>
                    <td class='style6'>test7</td><td class='style6'>test8</td><td class='style6'>test9</td>
                </tr>
                <tr><td class='style1'>序号1</td><td class='style2'>单位2</td><td class='style3'>姓名1</td>
                    <td class='style6'>test1</td><td class='style6'>test2</td><td class='style6'>test3</td>
                    <td class='style6'>test4</td><td class='style6'>test5</td><td class='style6'>test6</td>
                    <td class='style6'>test7</td><td class='style6'>test8</td><td class='style6'>test9</td>
                </tr>
                <tr><td class='style1'>序号1</td><td class='style2'>单位2</td><td class='style3'>姓名1</td>
                    <td class='style6'>test1</td><td class='style6'>test2</td><td class='style6'>test3</td>
                    <td class='style6'>test4</td><td class='style6'>test5</td><td class='style6'>test6</td>
                    <td class='style6'>test7</td><td class='style6'>test8</td><td class='style6'>test9</td>
                </tr>
                <tr><td class='style1'>序号1</td><td class='style2'>单位2</td><td class='style3'>姓名1</td>
                    <td class='style6'>test1</td><td class='style6'>test2</td><td class='style6'>test3</td>
                    <td class='style6'>test4</td><td class='style6'>test5</td><td class='style6'>test6</td>
                    <td class='style6'>test7</td><td class='style6'>test8</td><td class='style6'>test9</td>
                </tr>
                <tr><td class='style1'>序号1</td><td class='style2'>单位2</td><td class='style3'>姓名1</td>
                    <td class='style6'>test1</td><td class='style6'>test2</td><td class='style6'>test3</td>
                    <td class='style6'>test4</td><td class='style6'>test5</td><td class='style6'>test6</td>
                    <td class='style6'>test7</td><td class='style6'>test8</td><td class='style6'>test9</td>
                </tr>
               
                              
            </table>
        </div>
    </div>
</body>
</html>

解决方案 »

  1.   

    滚动条 全放在外面的DIV中里面的DIV AUTO HEIGHT AUTO WIDTH
      

  2.   

    你这样实现不行，你想要固定表头还有其他方法。表头和内容应该在一个div中
    <html> 
    <head> 
    <meta   http-equiv="Content-Type"   content="text/html;   charset=gb2312"> 
    <title>JK:支持民族工业,尽量少买X货</title> 
    <style> 
    .fixedHeaderTr    
    {    
    position:relative;    
    top:expression(this.offsetParent.scrollTop);    
    };    
       
    .mainDiv    
    {    
    overflow:auto;    
    scrollbar-face-color:9999ff; 
    height:expression((document.body.clientHeight-this.offsetTop-20>this.children[0].offsetHeight)?(this.children[0].offsetHeight+20)   :   (document.body.clientHeight-this.offsetTop-20));    
    width:expression(document.body.clientWidth-20);    
    } 
    </style> 
    </head> 
       
        <body>       <div   class="mainDiv"> 
                <table   width="100%"   border=1   cellspacing=0   style="margin-top:-2px"   > 
                <TR   class="fixedHeaderTr"   bgcolor="red" > 
                <TD   >Header   A</TD> 
                <TD   >Header   B</TD> 
                <TD   >Header   C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD   nowrap   > 
                    sdfsadfd</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                <TR> 
                <TD>A</TD> 
                <TD>B</TD> 
                <TD>C</TD> 
                </TR> 
                </table> 
          </div> 
        </body> 
    </html>
      

  3.   

    有没有js技术好的，或对这个比较熟的，帮忙看看，比较急，谢谢了 ！！！
    不想用expression()样式实现。
      

  4.   

    <html>
    <head><script type="text/javascript">
    function scroll()
    {
      var divbody = document.getElementById('divbody');
      //divbody.style.margin = "0";
      // divbody.style.width="100%";
      //该怎样实现，
    }
      </script>  <style type='text/css'>
      .divContainer
      {
      margin-top: 50PX;
      margin-left: 50PX;
      width: 500px;
      height: 238px;
      overflow-x:scroll;
      overflow-y:scroll;
      border:solid 1 silver;
      }
      .divhead
      {
      height: 43px;
      width: 100%;
      }
      .tablehead
      {
      border-collapse: collapse;
      table-layout: fixed;
      border: solid 1px silver;
      }
      .tablehead td
      {
      border: solid 1px Silver;
      }
      .trhead2
      {
      background-color: #D2EEFC;
      border: solid 1px Silver;
      white-space: nowrap;
      }
      .divbody
      {
      height: 178px;
      margin-bottom: 15px;
      width: 100%;
      }
      .tablebody
      {
      border-collapse: collapse;
      table-layout: fixed;
      border: solid 1px Silver;
      }
      .style1
      {
      width: 37px;
      text-align: center;
      border: solid 1px Silver;
      }
      .style2
      {
      width: 92px;
      text-align: center;
      white-space: normal;
      border: solid 1px Silver;
      }
      .style3
      {
      width: 61px;
      text-align: center;
      border: solid 1px Silver;
      }
      .style6
      {
      width: 90px;
      height: 40px;
      border: solid 1px Silver;
      white-space: nowrap;
      }
      </style>
    </head><body>
      <div class='divContainer' onscroll='scroll()'>  <div class='divhead'>
      <table class='tablehead'>
      <tr class='trhead2'>
      <td class='style1'>序号</td>
      <td class='style2'>单位</td>
      <td class='style3'> 姓名</td>
      <td class='style6'>test1</td>
      <td class='style6'>test2</td>
      <td class='style6'>test3</td>
      <td class='style6'>test4</td>
      <td class='style6'>test5</td>
      <td class='style6'>test6</td>
      <td class='style6'>test7</td>
      <td class='style6'>test8</td>
      <td class='style6'>test9</td>
      <td class='style6'>test10</td>
      </tr>
      </table>
      </div>  <div id='divbody' class='divbody'>
      <table class='tablebody'>
      <tr>
      <td class='style1'>序号1</td><td class='style2'>单位2</td><td class='style3'>姓名1</td>
      <td class='style6'>test1</td><td class='style6'>test2</td><td class='style6'>test3</td>
      <td class='style6'>test4</td><td class='style6'>test5</td><td class='style6'>test6</td>
      <td class='style6'>test7</td><td class='style6'>test8</td><td class='style6'>test9</td>
      </tr>
       <tr>
      <td class='style1'>序号1</td><td class='style2'>单位2</td><td class='style3'>姓名1</td>
      <td class='style6'>test1</td><td class='style6'>test2</td><td class='style6'>test3</td>
      <td class='style6'>test4</td><td class='style6'>test5</td><td class='style6'>test6</td>
      <td class='style6'>test7</td><td class='style6'>test8</td><td class='style6'>test9</td>
      </tr> <tr>
      <td class='style1'>序号1</td><td class='style2'>单位2</td><td class='style3'>姓名1</td>
      <td class='style6'>test1</td><td class='style6'>test2</td><td class='style6'>test3</td>
      <td class='style6'>test4</td><td class='style6'>test5</td><td class='style6'>test6</td>
      <td class='style6'>test7</td><td class='style6'>test8</td><td class='style6'>test9</td>
      </tr> <tr>
      <td class='style1'>序号1</td><td class='style2'>单位2</td><td class='style3'>姓名1</td>
      <td class='style6'>test1</td><td class='style6'>test2</td><td class='style6'>test3</td>
      <td class='style6'>test4</td><td class='style6'>test5</td><td class='style6'>test6</td>
      <td class='style6'>test7</td><td class='style6'>test8</td><td class='style6'>test9</td>
      </tr> <tr>
      <td class='style1'>序号1</td><td class='style2'>单位2</td><td class='style3'>姓名1</td>
      <td class='style6'>test1</td><td class='style6'>test2</td><td class='style6'>test3</td>
      <td class='style6'>test4</td><td class='style6'>test5</td><td class='style6'>test6</td>
      <td class='style6'>test7</td><td class='style6'>test8</td><td class='style6'>test9</td>
      </tr> <tr>
      <td class='style1'>序号1</td><td class='style2'>单位2</td><td class='style3'>姓名1</td>
      <td class='style6'>test1</td><td class='style6'>test2</td><td class='style6'>test3</td>
      <td class='style6'>test4</td><td class='style6'>test5</td><td class='style6'>test6</td>
      <td class='style6'>test7</td><td class='style6'>test8</td><td class='style6'>test9</td>
      </tr> <tr>
      <td class='style1'>序号1</td><td class='style2'>单位2</td><td class='style3'>姓名1</td>
      <td class='style6'>test1</td><td class='style6'>test2</td><td class='style6'>test3</td>
      <td class='style6'>test4</td><td class='style6'>test5</td><td class='style6'>test6</td>
      <td class='style6'>test7</td><td class='style6'>test8</td><td class='style6'>test9</td>
      </tr> <tr>
      <td class='style1'>序号1</td><td class='style2'>单位2</td><td class='style3'>姓名1</td>
      <td class='style6'>test1</td><td class='style6'>test2</td><td class='style6'>test3</td>
      <td class='style6'>test4</td><td class='style6'>test5</td><td class='style6'>test6</td>
      <td class='style6'>test7</td><td class='style6'>test8</td><td class='style6'>test9</td>
      </tr> <tr>
      <td class='style1'>序号1</td><td class='style2'>单位2</td><td class='style3'>姓名1</td>
      <td class='style6'>test1</td><td class='style6'>test2</td><td class='style6'>test3</td>
      <td class='style6'>test4</td><td class='style6'>test5</td><td class='style6'>test6</td>
      <td class='style6'>test7</td><td class='style6'>test8</td><td class='style6'>test9</td>
      </tr> <tr>
      <td class='style1'>序号1</td><td class='style2'>单位2</td><td class='style3'>姓名1</td>
      <td class='style6'>test1</td><td class='style6'>test2</td><td class='style6'>test3</td>
      <td class='style6'>test4</td><td class='style6'>test5</td><td class='style6'>test6</td>
      <td class='style6'>test7</td><td class='style6'>test8</td><td class='style6'>test9</td>
      </tr> <tr>
      <td class='style1'>序号1</td><td class='style2'>单位2</td><td class='style3'>姓名1</td>
      <td class='style6'>test1</td><td class='style6'>test2</td><td class='style6'>test3</td>
      <td class='style6'>test4</td><td class='style6'>test5</td><td class='style6'>test6</td>
      <td class='style6'>test7</td><td class='style6'>test8</td><td class='style6'>test9</td>
      </tr> <tr>
      <td class='style1'>序号1</td><td class='style2'>单位2</td><td class='style3'>姓名1</td>
      <td class='style6'>test1</td><td class='style6'>test2</td><td class='style6'>test3</td>
      <td class='style6'>test4</td><td class='style6'>test5</td><td class='style6'>test6</td>
      <td class='style6'>test7</td><td class='style6'>test8</td><td class='style6'>test9</td>
      </tr>
      </table>
      </div> </div>
    </body>
    </html>