Question

大家好，

我在这个网站上遇到了Firefox的问题：

我已经构建了一个水平滑块，除了firefox（两个OSX都是Windows）之外，它适用于所有浏览器。问题是 firefox在滑块中的图像后显示的边距/填充/空间比5px的左边距和右边距更多。另一个奇怪的事情是第一张图像的间距小于其他图像的间距。

我试图在其中加入.js解决方法：

function onPageLoad(){
    // Firefox rare spacing fix //
    setTimeout(function() {
        jQuery('.horizItem').each(function() {
            var outerWidth = jQuery(this).find('img').outerWidth();
            jQuery(this).width(outerWidth);
        });
    }, 300);
}
onPageLoad();

这大部分时间都有效，但有时会使包含10或20像素宽的图像的div。所以它搞砸了滑块。

是否有一个简单的css修复程序可用于删除这些奇怪的间距？

我似乎无法在元素检查器中找到间距的来源...... 当我将div的宽度与图像的宽度进行比较时，差异（减去预期10px边际）是15.883px，这也是一个奇怪的数字。

有人能帮助我吗？我觉得这是一个真正简单的错误，我正在某个地方。

非常感谢。

Answer 1

在制作Tumblr主题时，我遇到了类似问题;图片和Tumblr照片（在iframe中显示的照片）显示了一些＆＃34;填充＆＃34;在它们下面，尽管CSS中的填充为零。解决方案是让它们成块;

img, iframe {
    display: block;
}

也许您可以尝试将图片显示为inline-block，因为它们是并排的？

Firefox在div中添加额外的空间（或者使div更大）

1 个答案: