Question

在http://www.duncannz.com我遇到的问题只发生在v1.0 和IE 8之前的 ~~Opera~~ Opera中。如果你打开其中任何一个浏览器，访问该网站并尝试向下滚动...它会。即使身体只有100％的宽度。滚动时，您会看到一个间隙是<html>元素的一部分，而不是<body>元素，判断该额外位的背景如何。

为什么向下滚动时Opera的底部会有差距？也出现在IE 8中。

有什么想法吗？
感谢
编辑：这不是由您看到的页脚引起的 - 如果您访问较长的页面，例如http://www.duncannz.com/pages/text-to-code.php，请向下滚动该页面。
编辑2：所以这个问题似乎在Opera 12中得到修复，以及img border-radius没有工作的错误。但是我的版本较旧，我经常apt-get update && apt-get upgrade。如果我使用旧版本并且从未被告知过新版本，我相信其他人也是如此。另外还需要IE 8修复。

编辑3：

我找到了原因，但不是解决方案。我的box-shadow上有body（以及PIE解决方法）。将模糊应用于box-shadow时，阴影会扩展。这种膨胀导致阴影下降到身体下方，并且在视线之外。然而，在旧的Opera版本和IE8中，这种小故障导致在身体下方浸透的阴影模糊不会消失，而是创建一个可滚动区域，以便您可以看到整个box-shadow。 / p>
如果不清楚here's a demo - 将第一个值 - “角度”设置为0deg，请将第3个值 - “模糊”设置为0px并查看。然后增加模糊，你会看到阴影下方阴影的模糊。不幸的是，在IE8上，这种模糊会在身体下方产生间隙（因此用户会看到整个模糊）

如果我删除模糊，则没有可滚动区域。但是我想要模糊 - 没有它看起来很可怕。

我该怎么做？

Answer 1

你有没有理由选择

body {min-height: 100%;}

而不是

body {height: 100%;}

顺便说一句，当您慢慢调整窗口大小时，它仍然会出现在Opera 12.0中。有些州正在发生这种情况。我会说它必须在代码中出现类似舍入错误的内容。

我还会略微增加底部的身体填充。

Answer 2

您需要删除hr的边距：

hr.blackhr {
  margin: 0px;
}

更一般地说，您需要的是CSS reset以避免此类问题。

Opera和IE8 - 身体下方的差距

2 个答案: