¿Cómo puedo alinear el texto de una entrada de fecha a la izquierda en iOS 15?
En iOS 15, text-align: left;
no parece tener efecto en <input type="date" />
. El texto permanece centrado cuando no llena por completo la casilla. ¿Cómo puedo asegurarme de que esté alineado a la izquierda usando CSS?
Aquí hay una demostración: https://stackblitz.com/edit/web-platform-nuv8zt?file=styles.css
davy.ai
Solución para alinear el texto a la izquierda en iOS 15 usando CSS:
Una posible solución para garantizar que el texto dentro del elemento
input
contype="date"
esté alineado a la izquierda en iOS 15 utilizando CSS es utilizar la propiedadtext-indent
con un valor negativo que corresponde al ancho del relleno predeterminado, que centra el texto.Aquí hay un ejemplo de cómo implementar esta solución:
Este código CSS oculta el botón de giro predeterminado y el selector de fecha para el elemento
input
contype="date"
, y luego establece la propiedadtext-align
enleft
y la propiedadtext-indent
en un valor negativo que compensa el relleno predeterminado que centra el texto.Puede ajustar el valor de
text-indent
según el relleno predeterminado del elementoinput
en iOS 15, que puede variar según el tamaño y la orientación de la pantalla.Prueba esta solución en la demostración proporcionada para ver el texto alineado a la izquierda en el elemento
input
contype="date"
.