Question

我想要一个简单的设计，我在左侧有一个菜单，在右侧有一个主内容div。

到目前为止，除了我的主内容div中的垂直滚动条没有显示外，一切都有效。我就是这样做的：

<html>
<body style="overflow: hidden; padding: 0px; margin: 0px;">

    <table style="height:100%; width:100%;">
        <tr>
            <td style="height:100%; width:200px; background-color:#DDAAAA;">
                Menu
            </td>
            <td>
                <div style="position:fixed; top:0px;height:100%; width:100%; background-color:#88AA88; overflow:auto;">
                    CONTENT ...
                </div>
            </td>
        </tr>
    </table>

</body>
</html>

我想要的是主要内容会在浏览器窗口调整大小时调整大小 - 但这不应该影响该div中显示的实际内容。

修改

在没有桌子的情况下尝试：

<html>
<body style="overflow: hidden; padding: 0px; margin: 0px;">

    <div style="height:100%; width:100%; background-color:#DDDDDD;">

        <div style="height:100%; width:200px; background-color:#DDAAAA; float:left; overflow: hidden;">
            Menu
        </div>

        <div style="margin-left:200px;height:100%; width:100%; background-color:#88AA88; ; overflow: auto;">
            CONTENT
        </div>

    </div>

</body>
</html>

为什么我没有得到垂直滚动条，因为内容溢出包装div？

0 个答案: