为什么font-icons有额外的高度？

Question

我正在使用一组使用Ico moon创建的图标字体.这些图标在Firefox和Chrome中看起来效果很好,但图标显示在IE 10中,具有更高的高度.

我不确定高度来自哪里.

在IE 10中,图标看起来具有更高的高度.

这是他们在具有正确高度的铬中的样子.

这是图标的CSS:

font-family: 'IconFont';
speak: none;
font-style: normal;
font-weight: normal;
line-height: 1;
-webkit-font-smoothing: antialiased;

这是IE10 Dev工具的跟踪样式.

我在codepen.io上对simliar问题进行了快速演示.演示就在这里

是否有人遇到过类似的问题？有人找到了解决这个问题的方法吗？

Answer 1

行高问题：1

你写

line-height: 20px ;