Css 调整大小时Firefox背景图像下闪烁的线条

我正在建立一个网站，它的标题中有一个全宽的背景图像，可以根据页面大小调整大小。在Firefox中调整图像大小时，图像下方会出现一条不寻常的闪烁水平线。该行不会以完全显示，但在更改大小时会闪烁。该行显示在背景图像的底部，而不是标题元素的底部

只有当我在OSX 10.8.4和Firefox 23.0中测试它时，它才会出现在Firefox的MacOS版本中。这个问题在Windows8、Firefox23.0.1或我测试过的其他浏览器中都没有出现

以下是我的标题上的代码：

<header>
    <h1><span>Sound Soups on Madison - Healthy &amp; Convenient Alternatives for Your Busy Work Week</span><a href="index.php"><img src="images/sound-soups.jpg" id="logo" alt="Sound Soups"></a></h1>
    <nav id="nav-main">
        <?php echo makeLinks($nav1); ?>
    </nav>
</header>


header{
    padding:0 2.12765957% 35px;
    overflow:hidden;
    background-image:url('../images/bg-header.jpg');
    background-repeat:no-repeat;
    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
}

麦迪逊健康汤；为您繁忙的工作周提供方便的选择
标题{
填充：0.2.12765957%35px；
溢出：隐藏；
背景图像：url（'../images/bg header.jpg'）；
背景重复：无重复；
-webkit背景大小：100%；
-moz背景大小：100%；
-o-背景尺寸：100%；
背景大小：100%；
}

我尝试使用封面而不是100%作为背景大小，并在标题下添加填充或边框。谷歌搜索这个问题没有发现任何问题。如果有人知道这里的答案，请提前感谢。

编辑：

这个问题似乎与FireFox如何缩放背景图像有关。以下内容似乎为我解决了Firefox23.0.1、OSX10.8.4的问题

在style.css中，尝试将标题规则中的背景大小属性从100%自动更改为99.99%自动，即

header {
background-image: url("../images/bg-header.jpg");
background-repeat: no-repeat;
background-size: 99.99% auto; 
margin: 0;
overflow: hidden;
padding: 0 2.12766% 35px;
}

---

如果我正确理解您的问题，请检查样式表顶部@

你有

header{
    background-image:url('../images/none.png');
    padding-bottom:15px;
    border-bottom:2px solid #7a918c;
    margin-bottom:20px;     
}  

我认为边界底部是问题的原因

---

祝你好运

我通过将.jpg背景图像转换为.png解决了这个问题。如果其他人遇到此问题并且无法更改背景大小，请尝试此操作。

对于body元素上的背景大小的图像也有相同的问题。 我通过将背景大小的图像应用于定位的div元素来修复它

---

如果有什么帮助的话。

谢谢你，大卫。我采用了那种风格，但它并没有解决问题。它仍然在更宽的屏幕上闪烁，然后才进入响应式风格。是的，我明白你的意思@Julie，我看错了东西。在我看来，这是FF处理背景图像缩放的方式。如果删除标题中的背景大小属性并替换为背景位置：右下角；线路断了，这就解决了！非常感谢你，大卫。我很高兴这能帮到你@Julie。这是一个奇怪的FF光点，我不知道这是否是一个舍入错误问题，但肯定是我第一次遇到它。@spinningarrow，Firefox似乎并不总是正确缩放背景图像，我相信你看到的线条实际上是一个1像素的空白。这个补丁对我有用。在CSS中，将规则“背景色：#fff；”添加到HTML选择器中和“溢出：隐藏；”设置背景色意味着您看不到空白，而溢出隐藏迫使此背景色环绕并覆盖所有包含的元素（即整个页面）。我遇到了相同的问题-请看这里，这对我不起作用。我已将

背景大小

设置为

包含

。