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/ 。 不幸的是显示：内联； 等等会导致这类问题。