背景图像消失

Question

我为我的单页滚动网站制作了一个小的（100x50）背景图像，如下所示：

section:before
{
    position: fixed;
    z-index: -1;
    right: 0;
    left: 0;

    height: 105%;
    margin: -15px -15px 0 -15px;

    content: '';
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover;

}
section.first-page:before
{
    background-image: url('/images/first-background.png');
}

所以我有四个部分的高度设置为100％。

在Chrome中，这非常有效，但在Firefox中，最后两张图片消失了。我看到一个白色背景，当我打开浏览器控制台时，图像加载304.但真正糟糕的是，当有时打开控制台或只是重新加载时，背景重新出现!!

Here is a demo