Css 垂直居中的100%高度div不'；在Firefox中，你无法达到顶峰

这是密码

<style>
.test{
  position:absolute;
  width:100px;
  height:100%;
  top:50%;
  transform:translateY(-50%);
  background:blue;
}
</style>
<div class="test"></div>

.测试{
位置：绝对位置；
宽度：100px；
身高：100%；
最高：50%；
转化：translateY（-50%）；
背景：蓝色；
}

这是一张它看起来像什么的图片。我在Chrome和IE中测试了这一点，但差距没有出现

如果我将高度设置为

100%

100vh

或绝对高度（以像素为单位），则间隙仍然存在。我使用的是Firefox40，所以浏览器是最新的

此外，对于任何想知道为什么要将高度为100%的div居中的人来说，无论屏幕的方向如何，它都会居中

编辑
对于所有建议设置

margin:0

的人来说，不幸的是，这并不能解决问题

问题的澄清。

---

显然，这是渲染引擎中的舍入错误。因为如果你改变窗口的高度，间隙就会出现并消失。铬似乎显示出轻微的差距，但几乎无法区分。要查看问题，请尝试更改此小提琴中的帧高度。我想这也意味着没有简单的方法来解决问题。

添加

边距：0到正文

之前：
之后：
这将修复它：

 body{
    margin: 0;
 }

如果按如下所示减少“top”属性值，则永远不会得到间隙

top:49%
并且正文中并没有边距和填充物？主要是因为正文的边距或填充物。在iframe中查看您的代码：但是绝对位置不应该忽略主体边距吗？根据您提供给我们的css，这个问题不会发生在我更新的firefox上mac@coozin也许这是Windows版Firefox中的一个bug