Css 将绝对位置的div垂直居中？

我有这个：

.ce\u text.forward{
位置：相对位置；
溢出：隐藏；
填充：20px；
背景色：#F8；
颜色：#2d353c；
}
.ce_text.forward p{
位置：相对位置；
}
.ce\u text.forward.fill\u底部{
宽度：500px；
高度：500px；
底部：0；
左：-865px；
位置：绝对位置；
保证金：自动；
背景色：#埃塞迪；
顶部：0px；
右：0；
过渡：左0.3s线性0；
变换：旋转（45度）；
}
.ce_文本。前进：悬停。填充底部{
左：0；
}

Firefox中的问题似乎是由于使用了

margin:auto

。我完全重新构建了您的示例以消除此问题

新的和改进的

• 无固定高度。高度由百分比（可修改）和最小高度控制

• 无额外标记。三角形使用伪元素创建并旋转。文本以其
  包装居中

• 居中三角形。三角形在任何高度居中，底部为50%，底部负边距为其高度的一半

• 无间隙-三角形足够大，可以消除拐角处的任何间距。如果你需要它更大，它可以根据需要大；只需保持高宽比为1:1，并增加负底部边距的大小。

  *{
  保证金：0；
  填充：0；
  }
  html，正文{
  身高：100%；
  }
  h1{
  背景：#333；
  身高：40%；
  最小高度：140px；
  位置：相对位置；
  溢出：隐藏；
  z指数：0；
  }
  H1A{
  显示：块；
  身高：100%；
  位置：绝对位置；
  最高：50%；
  边缘顶部：-0.56em；
  左：100px；
  }
  h1：之前{
  内容：''；
  显示：块；
  位置：绝对位置；
  底部：50%；
  边缘底部：-1000px；
  左：-2000px；
  高度：2000px；
  宽度：2000px；
  背景：#F00；
  变换：旋转（45度）；
  过渡：左0.3s；
  z指数：-1；
  }
  h1：悬停：之前{
  左：0；
  }

  ---

  Text

  请详细说明到底是什么不起作用。在chrome中，div fill_底部垂直居中，在firefox中，底部是更多。想知道更多。。你面临什么问题。。正如我在firefox中测试的那样，我没有发现任何问题。你真正想做的是一个悬停效果，div fill_底部从左到右，div fill_底部在chrome中定位完美，在firefox中div不在悬停效果的中心。这与

  margin:auto

  在

  .ce\u text.forward.底部填充
  。Firefox的呈现方式与Chrome不同。删除它，您可以在Chrome中重新创建问题。谢谢，但问题是，我没有固定的高度，因此高度需要灵活。您需要的最小高度和最大高度是多少？最小高度大约为140px，最大高度大约为140px300px@LydiaMaier-请测试我新的改进解决方案：）Danke you，太可怕了