Question

我知道我可以将下面的样式放在一个CSS文件中，但这是以后的如果固定/可变宽度的center部分中有任何内容（红色），您可以帮助制作滚动条吗？在某些情况下，用户的屏幕可能比内容小，但奇怪的是没有滚动条出现。

<html>
    <body>
    <div id="header" style="background: #555;margin: 0px; padding 0px; position: fixed; top: 0px; left: 0px; width: 100%;min-width: 900px; height: 50px;overflow: auto;">
    </div>

    <div id="menu" style="background: #444;margin: 0px; padding 0px; position: fixed; top: 50px; left: 0px; width: 200px; height: 100%;overflow: auto;">
    </div>

    <div id="center" style="background: #666;margin: 0px; padding 0px; position: fixed; top: 50px; left: 200px; width: 100%;min-width: 900px; height: 500px;overflow: auto;">
        <div style="width: 600px; height: 300px; background: red;overflow: auto;">
        </div>
    </div>

    <div id="footer" style="background: #777;margin: 0px; padding 0px; position: fixed; bottom: 0px; right: 0px; width: 100%;min-width: 900px; height: 50px;overflow: auto;">
    </div>
    </body>
</html>

Answer 1

您的滚动条未显示的原因是由于 #center div上的位置已固定。

对于我相信你所追求的事情，这是一个小提琴：http://jsfiddle.net/qgeLp1jn/

在 #content div中，更改其宽度以使滚动条显示

#content {
    width: 500px;
    height: 300px;
    background: red;
}

如何在浏览器中显示水平和垂直滚动？溢出：自动;不起作用

1 个答案: