在Firefox上,溢出:隐藏的作品,但仍保留滚动条和空格

我知道Firefox与溢出有点不一致:隐藏;我读了相关的故事。因此,在溢出之上:隐藏;属性,我也添加了剪切路径:inset(0 0 0 0);甚至-moz-overflow:隐藏;。结果,溢出确实被隐藏了,但是仍然有很大的空白空间。如何摆脱这种情况?

这是我的CSS:

    .site-footer {
        position: relative;
        display: table;
        -moz-overflow: hidden;
        overflow: hidden;
        clip-path: inset(0 0 0 0);
        background-color: #10142F;
        width: 100%;
        padding-top: 30px;
    }

    .site-footer::before{
        content: "";
        width: 350%;
        max-width: 350%;
        display: table-cell;
        height: 120%;
        left: -125%;
        top: -10%;
        position: absolute;
        z-index: 0;
        background-image: url('media/backgrounds/blue-planet-4-1700-2.jpg');
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        -webkit-animation: spin 160s linear reverse infinite;
        animation: spin 160s linear reverse infinite;
    }

有问题的元素是旋转的背景伪元素,它比父元素大(故意),但我应该能够使用CSS切断它。

这是网站: www.satya-ame-art.com

此问题出现在本网站页脚的最后。在Chrome和Safari上,效果很好...

非常感谢您!

oxforever 回答:在Firefox上,溢出:隐藏的作品,但仍保留滚动条和空格

产生溢出:隐藏在页面元素中

#page {
  overflow: hidden;
}
本文链接:https://www.f2er.com/3167529.html

大家都在问