我想通过添加一个背景,使一个achor标记按钮,虽然它看起来不错,在铬和safari,firefox 15.0.1似乎有一个错误。Firefox的奇怪填充使用锚标记
例如,http://jsfiddle.net/cqVjj/3/显示文本甚至不是垂直居中。我甚至没有指定填充,宽度或高度,但我期望与chrome类似的结果。 Firefox我在底部看到一个空间。
任何解决方案?
铬21.0.1
火狐15.0.1
我想通过添加一个背景,使一个achor标记按钮,虽然它看起来不错,在铬和safari,firefox 15.0.1似乎有一个错误。Firefox的奇怪填充使用锚标记
例如,http://jsfiddle.net/cqVjj/3/显示文本甚至不是垂直居中。我甚至没有指定填充,宽度或高度,但我期望与chrome类似的结果。 Firefox我在底部看到一个空间。
任何解决方案?
铬21.0.1
火狐15.0.1
简单的解决方法:
你缺少line-height
属性。它是相同的值font-size
:
line-height: 34px;
我更新您的jsfiddle:http://jsfiddle.net/cqVjj/4/
好吧,它使浏览器一致,但它仍然有更多的空间在底部比顶部。我会张贴图片来说明 – Adam
我使用的是helvetica,这似乎是问题 – Adam
所以我想在这种情况下填充冷凝的作品。 –
渲染将取决于浏览器使用的确切字体以及他们决定用于这些字体的确切上升和下降度量。请注意,你甚至不告诉他们在你的小提琴中使用相同的字体系列。
但即使是过去认为,什么CSS2.1已就此事说的是(从http://www.w3.org/TR/CSS21/visudet.html#inline-non-replaced):
The height of the content area should be based on the font, but this
specification does not specify how. A UA may, e.g., use the em-box or
the maximum ascender and descender of the font.
我怀疑你正在寻找的浏览器实际上只是用不同的定义内联的内容区域。
在Chrome和Firefox中对我来说看起来也一样。 – j08691
在这两个浏览器中看起来都一样.. –
检查出添加的图像。它不会出现在你的Firefox 15.0.1浏览器中。如果这有什么不同,我也在osx上。 – Adam