Музыкальный плоский знак показывает дополнительное заполнение и увеличивает высоту линии.

Question

При использовании музыкального плоского знака (♭) в мобильном браузере он выделяет дополнительное пространство перед ним и, похоже, испортит высоту линии. Я попытался

• Различных шрифтов (по-прежнему происходит без указания шрифта)
• font-kerning: (none|normal|auto);
• В letter-spacing свойства, которое фиксирует ее по телефону, но разбивает его на рабочем столе.

Есть ли что-нибудь, что я могу сделать, чтобы исправить эту полосу, используя изображения?

Вот несколько скриншотов.

Chrome рабочий стол:

Chrome мобильный (Обратите внимание, что коробки не все одинакового размера и есть пространство перед ♭):

Answer 1

Эта причина такого рода происшествий лежит на свойстве высоты линии. Вы можете проверить это поведение с помощью инструмента проверки google (Ctrl + Shift + i) с Google Chrome.

вы можете легко увидеть, что эти «высшие» ячейки получают дополнительную высоту от самого шрифта (а не от прокладки, поля или чего-либо еще).

Просто добавьте:

line-height: 1; 

Это приведет к тому, высота шрифта быть исправлена.

* примечание: используйте свойство межстрочного интервала с буквенным интервалом, чтобы отображать только мобильный экран.