<input type = «submit»> ошибка заполнения в Safari mobile?
(Это похоже на (также без ответа) вопрос# 3430506, но применяется к входным тегам вместо элементов HTML5.)
На кнопках <input type = "submit"> браузер iPhone / mobile Safari добавляет отступы слева и справа. Этого не происходит ни в настольной версии, ни в любых других мобильных / настольных браузерах Webkit, которые я пробовал. По-видимому, к каждой стороне добавляется размер шрифта в пикселях (т. Е. Шрифт 14px означает, что общая ширина равна 14px + ширина текста + 14px).
В настоящее время я пытаюсь сделать следующее:
/* webkit user-agent stylesheet uses input[type="submit"] */
form input[type="submit"] { /* more specific to override webkit */
-webkit-appearance:none;
-webkit-border-radius:0px;
margin:0;
padding:0;
border:0;
display:block;
}
Я видел много отзывов об использовании -webkit-creation: нет ... это не имеет значения. Также не удаляет закругленные углы. Я сделал демонстрационную страницу о том, как настольная версия отображает различные объекты -webkit-Appearance; у всех есть -webkit-border-radius: 0 и приведенный выше код.
Попробуйте просмотреть их на настольном Safari, а затем на iPhone:
http://deleri.com/test.html
(Скриншот Safari Mobile для тех, у кого нет iPhone :)
deleri.com/safari.png
Хотелось бы узнать, почему возникает эта ошибка, сейчас я больше обеспокоен ее исправлением. Я пробовал каждый тип отображения / переполнения / размера коробки / -webkit-что- / width: auto / text-indent, который только можно вообразить, и не могу исправить это, вручную установив ширину (конечная ширина должна быть в процентах- на основе, и странное дополнение все еще применяется). Я начинаю задумываться, не является ли это каким-то неясным свойством или таблица стилей агента пользователя не перезаписывается. Какие-нибудь мысли?