Вид ввода типа даты в Safari на iOS

Я пытаюсь использовать регулярную дату ввода типа для использования на мобильных устройствах. Но ширина, установленная в CSS, переопределяется Safari (или webkit).

Я могу добавить -webkit-appearance: none; в CSS и тем самым ширина будет работать так, как ожидалось. Но тогда я теряю все желаемое другое стилирование, например стрелку, указывающую, что это сборщик.

Есть ли способ, которым я могу сохранить базовый стиль даты типа ввода, но сам правило по ширине?

Ответ 1

-webkit-appearance: none; всегда удаляет типичный стиль сборщика... Но вы можете легко добавить стрелку, используя CSS и фоновое изображение.

Я не знаю, как настроить пользовательский стиль ввода, но также сохранить стрелку.

Ответ 2

Добавить -webkit-min-logical-width: <your desired value>. Он решил проблему для меня!

Ответ 3

если вы хотите выбрать только input[type='date'] и input[type='time'] попробуйте эту строку CSS.

input[type='date'], input[type='time'] {
    -webkit-appearance: none;
}