Используя grid-template-columns: 50% 50% У меня есть два <input> s рядом, введите text слева и time справа. iOS Safari, кажется, добавляет причудливый отступ к тому, что справа. Я не могу точно подтвердить , что делает, так как у меня нет мА c, все, что я мог сделать, это добавить border: 1px solid red;, чтобы проиллюстрировать проблему.
Снимок экрана
Соответствующие стили:
input[type="text"] {
background: none;
padding: 0;
margin: 0;
...
font-size: 18px;
line-height: 20px;
}
input[type="time"] {
display: block; /* Without this, iOS Safari ignores text-align: right */
text-align: right;
background: none;
padding: 0;
margin: 0;
...
font-size: 18px;
line-height: 20px;
}
Очевидно, что это работает безупречно в настольном Chromium.
ОБНОВЛЕНИЕ : я понял это " margin "на самом деле" индикатор выбора времени ", хотя это не какое-либо официальное название. Аналогичный псевдоэлемент будет ::-webkit-calendar-picker-indicator в <input type="date">. Все еще не решено, но, по крайней мере, я знаю, в чем проблема. Для этого нужно выяснить имя псевдоэлемента, возможно добавит еще один вопрос.