Question

我有一个带有2x2表的外部div，我想保留100％的页面，它不应该生成页面滚动条。

在其中一个顶部单元格中，div中有另一个表格，如何使内部表格在div内部滚动，以使外部表格不会超出页面边界。

    <div style="width: 100%;">
<table id="main" class="outer-surround" style="width: 100%;">
    <tr>
        <td style="width: 1px;"></td>
        <td style="">
            <div id="top" style="background-color: lightpink; border-spacing: 0px; overflow: hidden;">


                <table style="border-color:Gray;border-width:1px;border-style:Solid;">
                    <tbody>
                        <tr>
                            <td colspan="40">
                                <a href="#">ABC</a>
                            </td>
                        </tr>
                        <tr>
                            <td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td><td > <a href="#">ABC</a> </td>


                        </tr>
                    </tbody>
                </table>


            </div>
        </td>
    </tr>
    <tr>
        <td style="width: 1px;"><div style="background-color: lightgreen; height: 400px; display: inline-block;">Test</div></td>
        <td><div style="background-color: yellow; height: 400px; display: block;">Test</div></td>
    </tr>
</table>
</div>

'top'中的表格不应强制页面滚动，它应该在'top'div内滚动。

Answer 1

井表不能破坏所以它们总是强制上部元素滚动，除了你溢出：隐藏但是重要的数据根本不显示。

更好的快捷方式/包装/修复你的表格宽度和内容大小，以便上下文不会变得太大，或者如果你的目标是数据出现在下一行，你必须使用左浮动一些边距。

滚动表在100％Div内表中

1 个答案: