填充在浏览器之间表现不同

Question

我让这个项目继续进行，我有一个容器，从底部固定从透明到白色的渐变。我的目标是让容器看起来像用户骂人一样消失。

但我有一个问题，容器底部的内容有点被渐变本身隐藏。我决定在容器中添加一个填充底部，因此内容距离底部100px（exacly渐变的高度，100px）

它完全按照我在Chrome上的预期工作，但在Firefox和IE上，填充不是“占用空间”。

这是我的css相对于容器

.container {
    width: 85%;
    margin: 0 auto;
    overflow: auto;
    padding-bottom: 100px;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}

如果你仍然想要一个指向主项目的链接，那么你可以看到它的实际效果，也许可以更好地了解问题click here

我真的很感激这方面的一些帮助。这是我唯一想要结束这个项目的东西。

编辑：如果我不够清楚，请提出问题。