Выровняйте HTML-указатель даты ввода справа

Question

Мне не удалось выровнять средство выбора даты. Тип ввода = "datetime-local" справа от элемента ввода введите описание ссылки здесь

input{
  width:400px;
}

<input type="datetime-local" class="dateTime" name="starttime" id="startTime" step="2">

Это текущий вид:

Мое требование - расположить этот квадрат выбора даты справа без использования JavaScript

ожидаемый результат ниже ::

Answer 1

Используйте этот код, это поможет вам .. Я использую только CSS для ввода: text-align: right.

input{
  width:400px;
  text-align:right;
}

<input type="datetime-local" class="dateTime" name="starttime" id="startTime" step="2">

Answer 2

Если вы хотите выровнять содержимое ввода по правой стороне, просто используйте text-align: right; в css.Я не думаю, что возможно выровнять календарь вправо ... Но я также рекомендую вам использовать js datetimepicker из-за поддержки браузера

Answer 3

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

Так что, если вы хотите добиться того, для чего вам нужно использовать пользовательский указатель даты, тогда делайте все, что хотите, и выравнивайте его где угодно.

Вот несколько примеров

Answer 4

Вы можете использовать тег div, чтобы datetime-local находился в правой части страницы, как вам нужно.

Таким образом, ваш код будет:

<div align="right">
<input type="datetime-local" step="2">
</div>