音乐平面标志显示额外的填充并增加线高

Question

在移动浏览器上使用音乐平面符号（♭）时，它会在它之前渲染一个额外的空间，它似乎也会破坏线条高度。我试过了

• 不同的字体（仍然没有指定的字体）
• font-kerning: (none|normal|auto);
• letter-spacing属性，可将其修复到手机上，但会在桌面上将其破坏。

我有什么办法可以使用图像修复此栏吗？

以下是一些截图。

Chrome桌面：

Chrome mobile（请注意，这些方框的大小并不相同，并且在♭之前有空格）：

Answer 1

发生这种情况的原因在于行高属性。 您可以使用Google Chrome检查工具（ Ctrl + Shift + i ）检查此行为。

你可以很容易地看到那些＆＃34;更高的＆＃34;单元格从字体本身获得额外的高度（而不是填充，边距或其他任何东西）。

只需添加：

line-height: 1;

这将导致字体高度固定。

*注意：在媒体查询中使用letter-spacing属性仅定位到移动屏幕。