firefox - Firefox 5 中的 CSS 行高问题

Question

我在 Firefox 5 的页面上遇到了几个元素的垂直定位问题。当我在一段文本上设置 line-height 并给它一个相等的高度时，它不会垂直居中它应该的方式。相反，它坚持到其行高的顶部。

有问题的页面在这里:http://www.tyndale.ca/~missiodei/这是两个问题元素及其 CSS。在这两种情况下，文本在 FF5 中被向上推，但在 Chrome/Chromium 中正确显示(在其行高内垂直居中)。

• 横幅中的大标题链接 (#blogtitle a)

  position:relative;
  display:block;
  margin:0;
  padding:0;
  color:#fff;
  text-decoration:none;
  letter-spacing:.1em;
  font-family:"Palatino Linotype", Palatino, serif;
  font-weight:bold;
  opacity:0.6;
  height:120px;
  line-height:120px;
  

• 任何 float 在正文新部分开头的首字下沉(p.openingPar:first-letter)

  font-size:3em;
  font-weight:bold;
  position:relative;
  float:left;
  height:48px;
  color:#ccc;
  line-height:48px;
  margin-right:4px;
  

除非您使用 Chrome 或 Safari 查看页面，否则您可能看不到这些首字下沉，因为它们中的大多数根本不会在 FF 中显示。 (我不确定为什么这些样式也不被尊重)。

最后，想知道这是FF5独有的问题还是3.6和4.0有同样的问题会有所帮助。我没有任何旧版本的 FF 可用于快速测试。

提前感谢您的帮助。我把我的键盘印在了我的额头上，为了这个而猛烈抨击我的头!

Answer 1

垂直居中似乎对我来说很好....

缺少首字母样式是https://bugzilla.mozilla.org/show_bug.cgi?id=8253