为什么 fullpage.js 的部分大于窗口？答案

【问题标题】：Why is section larger than window for fullpage.js?为什么 fullpage.js 的部分大于窗口？
【发布时间】：2017-05-06 05:30:44
【问题描述】：

我正在使用fullpage.js 扩展来实现自动滚动。我创建了一个页脚并将其放在页面底部。但是，它没有显示，因为该部分（由绿色边框表示）大于窗口，如下所示。

当我关闭自动滚动时，我发现页面底部的页脚如下所示。

我假设 fullpage.js 部分占用了窗口的大小，那么为什么会发生这种情况以及如何解决这个问题？

HTML：

<div class = "section contact" anchor = "4thPage">
            <ul>
                <!-- buttons for GitHub, LinkedIn, Resume-->
           </ul>
            <div class = "footer"> © 2016 Full Name. All rights reserved. </div>
</div>

CSS：

.footer {
    bottom: 0;
    position: absolute;
}

.contact {
    text-align: center;
    padding-top: 5%;
    position: relative;
}

【问题讨论】：

标签： javascript html css footer fullpage.js

【解决方案1】：

您可能没有使用box-sizing: border-box。

Reproduction online

.content{
    position:absolute;
    border: 20px solid red;
    bottom:0;
    top:0;
    width: 100%;
      box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

HTML

<div class="section">
    <div class="content">
        One
    </div>
</div>

【讨论】：

我试过了，但没有用。当我在 chrome 上加载我的网站时，.fp-section 应用于每个部分 div 并且它已经具有 position: relative，因此将 position: relative 应用于 .section 被划掉。
好吧，显然它在我的示例中有效，这意味着您遗漏了一些东西。但是由于您没有为我们提供足够的代码，我只能为您做这些。