html - 网页中没有正确的滚动

Question

我写了一个网站如图here .
代码是:

<div id="mainDiv" class="container">
        <div id="header">
            <div class="plc">
                <h1><a href="#"></a></h1>
                <nav>
                    <div id="navPos">
                        <div style="position: relative;right: 113px;">Register</div>
                        <div style="position: absolute;right: 255px;top: 37px;">Login</div>
                        <div style="position: absolute;top: 38px;right: 123px;">Market</div>    
                    </div>
                </nav>
            </div>
        </div>
        <div id="body" class="container-fluid">
            <div id="container">
                <div id="overlay"></div>
                <div id="menu"></div>
                <div id="formPos"></div>
                <div id="or">OR</div>
                <div id="fbReg">
                    <img src="images/fbOne.png" id="fbIcon">
                    <div id="fbPos">Register with Facebook</div>
                </div>
                <div id="gReg">
                    <img src="images/gPlus.jpg" id="gIcon">
                    <div id="gPos">Register with Google</div>
                </div>
                <div id="cliPos">
                    <img src="images/Bistip-in-media.png" id="imgCli">
                </div>
            </div>
        </div>
        <div id="footer">
            hello
        </div>
    </div>  

CSS 可以在那个 jsfiddle 中找到。问题是:只有正文可滚动，但页眉和页脚不可滚动。结果，我看不到页脚。我该如何解决？ 为获得最佳效果，请展开 jsfiddle

的输出窗口

Answer 1

任何时候你发现没有滚动，是因为有 overflow:hidden; 属性，应该删除或更改为 'auto'

在你的案例中:

1) 删除 overflow:hidden; 或 overflow:auto; 2) 如果您不想滚动内容(即不包括页眉和页脚的部分)

DEMO

CSS

html,body
{
  overflow:auto; /* Or just REMOVE overflow*/
}


#body
{
  overflow:auto; /* Or just REMOVE overflow*/]
}