html - 垂直居中元素。行高与填充

Question

我正在尝试找到使两个左浮动元素垂直居中的最佳方法。

带填充的中心: http://jsfiddle.net/fUmMM/14/

行高居中: http://jsfiddle.net/fUmMM/15/

这两个版本都可以在较新的浏览器上使用，但是像 IE8 这样的旧浏览器呢？计算准确的填充以支持旧浏览器是否更好？行高版本对我来说更像是一种 hack，但速度更快。

Answer 1

行高和内边距通常在 IE8 中都可以。 It was buggy in IE6 though .

除此之外，无论如何都喜欢填充。除非您知道您的内容永远不必换行，否则不要使用line-height，因为一旦内容在两行或更多行上，效果会很大与使用 padding 方法相比，使用 line-height 包装成多行更容易损坏:

行高:http://jsfiddle.net/fUmMM/16/

---

对比

填充:http://jsfiddle.net/fUmMM/17/