div包裹的table,table的宽度超出了的宽度,出现的滚动条的在windows下无法拖动

问题描述

div包裹的table,table的宽度超出了的宽度,出现的滚动条的在windows下无法拖动

问题出现的环境背景及自己尝试过哪些方法

试过
1.table{table-layout : fixed ; }
2.table要给它设定一个父级div,并且设置父级div的属性
overflow:auto;display:block。
设置table的属性
min-width:100%
设置table td的属性:
min-width:50px
都不行。

阅读 3.2k
1 个回答

1.父级div是否设置了宽度,只有设置了宽度且滚动条在div内才是你想要控制的滚动
2.仅凭你说的这些属性不知道滚动条怎么不能动,可以贴一下代码?
3.横向需要滚动条的话必须设置table的确定宽度

做了一个demo:

.table{
    table-layout:fixed;
    width: 1000px;
    border: 1px solid #ccc;
}

.table td{
    border: 1px solid #ccc;
}

.wrapper{
    width:500px;
    height: 500px;
    overflow: auto;
    border: 1px solid #000;
}

<div class="wrapper">
    <table class="table">
        <tr>
            <td style="width:200px;">title</td>
            <td>title title title</td>
            <td>title</td>
            <td>title</td>
            <td>title</td>
            <td>title</td>
            <td>title</td>
            <td>title</td>
            <td>title</td>
            <td>title</td>
        </tr>
        <tr>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
        </tr>
        <tr>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
        </tr>
        <tr>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
        </tr>
        <tr>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
        </tr>
        <tr>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
        </tr>
        <tr>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
            <td>问题出现的环境背景及自己尝试过哪些方法</td>
        </tr>
    </table>
</div>

跟你的描述应该比较一致,你看下你的样式问题出在何处了

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏