WebKit內聯元素的垂直對齊方式不正確

Question

我有一個小的定義列表，我想在頁面的水平和垂直方向上以四列為中心。 我將html -element設置為display: table和要display: table-cell;的body display: table-cell; vertical-align: middle; 。

看到這個小提琴 。 如果您將第27行的font-size更改為4em; ， 4em; （或大於1em任何值），您會看到Chrome上的內容跳到了錯誤的位置，而之前是正確的。 在IE上，字體大小無關緊要，無論哪種方式，它都保持在正確的位置。

如果將dl設置為display: block ，那么它也可以在兩種瀏覽器上使用，但是我視覺上需要將它們內聯顯示。

我是在做錯什么還是Chrome中的錯誤。 如果是這樣，我該如何解決？

Answer 1

加

vertical-align: top;

給你的dl。 在這里檢查http://jsfiddle.net/qVcLE/6/ 。 不幸的是顯示：內聯； 等等會導致這類問題。