Отступы между символами в сообщении валидации html5

#html #html5 #вёрстка

Добавляю валидацию формы через атрибуты required и pattern, но символы расположены
очень близко один к одному.  

Как между ними сделать отступы?  

  

Использую такой код





  
  




    

Ответы

Ответ 1

Добавьте свойство letter-spacing: 5px; к данному блоку.

5px - изменяйте на своё значение.


Ответ 2

Если хочется, чтоб номер телефона разделялся определенным способом, то попробуйте
данную реализацию через JS:



new Formatter(document.getElementById('phone-input'), {
  'pattern': '+38 ({{999}}) {{999}}-{{9999}}',
  'persistent': false
});







Если речь шла именно об отступе между символами во всплывающем уведомлении, то вряд
ли получится повлиять на него. Насколько я понял, это системное уведомление из браузера.
Но, системное уведомление извлекается из title, поэтому вы можете его откорректировать
в такой вид: "Номер телефона в формате +380 (XX) XXX-XXXX".


Ответ 3

Покуда это системное уведомление браузера, и насколько мне известно, css'ом неизменяемое,
единственный совет - юзать кастомные тултипы, css/JS в помощь, гуголь свербит от их
изобилия.

Линк на англоязычный СО с таким же вопросом

Линк №2 - минималистичный css хак в ответе valli