Html 引导按钮显示按页脚剪切

jsp具有以下特性

<style>
    .footer {
        position: fixed;
        left: 0;
        bottom: 0;
        width: 100%;
        background-color: #f5f5f5;
        color: #324c70;
        text-align: center;
    }
</style>

<div class="footer"> Copyright MSCI 2019. All rights reserved.
</div>

</body>

</html>

.页脚{
位置：固定；
左：0；
底部：0；
宽度：100%；
背景色：#F5；
颜色：#324c70；
文本对齐：居中；
}
版权所有MSCI 2019。版权所有。

此页脚包含在页脚上方有一个引导按钮的页面中，并且正在被剪切

<button type="button" class="main" id="create" name="create" value="Create Change" style="background-color: #37617A;color: white;padding: 8px 20px;
                    margin: 8px 0; border: none; border-radius: 4px; cursor: pointer;" >
                Create Change
            </button>

创造变化

---

附件中的图片展示了我面临的问题

我认为你应该用一些填充物来抵消

固定的

页脚的高度损失。理想情况下，容器底部填充在页脚之前。[link]@TimVermaelen感谢这解决了我的问题！