Question

现在这可能非常简单，但我是HTML / CSS的新手，无法弄明白。这是HTML：

<html>
    <body>
        <table>
            <tr>
                <td style="width: 275px;background: gray;overflow: scroll">
                    <div style="height: 1000px;width: 250px; background: green;" />
                </td>
                <td style="width: 620px;background: yellow;">
                    def
                </td>
            </tr>
        </table>
    </body>
</html>

CSS：

html,body,table
{
    height: 100%;
    max-height: 500px;
}

我想要的是让这张桌子伸展到整页高度;如果左侧单元格的内容大于整页高度，左侧单元格中应显示一个简单的滚动条，让用户滚动它们。但相反，我的代码使整个表格更大，内部滚动条似乎永远不会起作用。

Answer 1

稍微改变你的造型：

<td style="width: 275px;background: gray;overflow: scroll; height: 100%">
   <div style="height: 100%;width: 250px; background: green;float: left" id="test" />
</td>
<td style="width: 620px;background: yellow;">
   def
</td>

并删除评论中提及的@Allan Kimmer Jensen {/ 1}}

max-height

Working example

<强>更新

将ID添加到div和javascript的位：

html,body,table
{
    height: 100%;
}

updated fiddle

如何将表拉伸到整页高度

1 个答案: