Ширина вертикальной полосы ширины курсора, которая постоянно отображается в сафари-вводе/textarea

Question

В Safari 9.0.3, Mac OS X El Capitan, на одной из моих страниц все элементы ввода и textarea демонстрируют это поведение при фокусировке: есть вертикальная бар, постоянно видимый слева от элемента, с шириной, меньшей, чем курсор ввода.

Когда элемент сфокусирован, курсор мигает, т. Е. Он включается и выключается. Так что я взял 2 скриншоты для обоих:

Когда курсор находится на:

Когда курсор от:

Как вы можете видеть на 2 изображения, где находится курсор выключен, по-прежнему имеется вертикальная панель, которая никогда не исчезает, когда элемент фокусируется.

Я попытался отследить, какие правила (-ы) CSS вызвали проблему, путем переключения правил один за другим в браузере. Оказалось, что это был размер шрифта. Но дело в том, что эта проблема возникает только тогда, когда размер шрифта установлен на определенное значение (14 пикселей в моем случае). Установка размера шрифта на другие значения приводит к тому, что панель отключается.

Это не происходит ни в каких других крупных браузерах.

Кто-нибудь еще видел это? Это ошибка Safari?

Answer 1

У меня была аналогичная проблема в Safari 10.1.2. Когда я щелкнул поле ввода, а затем щелкнул куда-то еще, так что поле пустое и не в фокусе, панель осталась. Ваше решение установить размер шрифта не помогло, но в моем случае было применено правило text-align: center;, применяемое к элементу ввода. Все работает нормально после того, как я переключил его на text-align: left;.