Question

我有一张桌子，无法让它可滚动 - 没有高于map的桌子。

    #table{
        width:252px;
        top:100px;
        left:100px;
        position: absolute;
        z-index: 3;
        font-size: 11px;
        background-color: rgba(247, 247, 247, 0.9);
        border: 1px solid #D7D2D2;
        max-height:252px;
        overflow: auto
    }
    table, th, td {
        border: 1px solid #D7D2D2;
        padding: 2px;
        max-height:252px;
        overflow: auto
    }

Answer 1

从表格中删除table个ID，然后添加一个table ID到您围绕它的div。

然后从max-height CSS规则中删除table, th, td。

你需要调整你的CSS，以确保它看起来仍然像你想要的那样，删除重复的边框等。

这是简化working example - 您应该可以将此应用到您的网页。

Answer 2

将#table包装在一个包装div中，该div具有固定的高度，具有溢出和定位。

以下是：

<强> HTML

<div class="table-wrapper">
    <table id="table">
        <tr>
            <th><b>Name</b>

            </th>
            <th><b>Address</b>

            </th>
            <th><b>Likes</b>

            </th>
        </tr>
        ...
    </table>
</div>

<强> CSS

.table-wrapper {
     max-height:152px;
     overflow-y:scroll;
     top:100px;
     left:100px;
     position: absolute;
     z-index: 3;
}

#table{
    width:252px;


    font-size: 11px;
    background-color: rgba(247, 247, 247, 0.9);
    border: 1px solid #D7D2D2;


}

小提琴：http://jsfiddle.net/Varinder/RA7e7/1/

Answer 3

您可以将表放在div中，然后使其滚动。不确定它是100％你想要什么，但它可以给你一些想法来解决问题。

<div id="Layer1" style="position:relative;width:350px;height:200px; overflow:
scroll;">control goes here</div>

无法使表格可滚动

3 个答案: