Respuestas:
Use la propiedad de alineación de texto en su CSS:
input {
text-align: right;
}
Esto tendrá efecto en todas las entradas de la página.
De lo contrario, si desea alinear el texto de una sola entrada, configure el estilo en línea:
<input type="text" style="text-align:right;"/>
Prueba esto en tu CSS:
input {
text-align: right;
}
Para alinear el texto en el centro:
input {
text-align: center;
}
Pero, debe estar alineado a la izquierda, ya que ese es el valor predeterminado, y parece ser el más fácil de usar.
input[type=text] { text-align:right }
<form>
<input type="text" name="name" value="">
</form>
La respuesta aceptada aquí es correcta, pero me gustaría agregar un poco de información. Si está utilizando una biblioteca / marco como bootstrap, puede haber clases integradas para esto. Por ejemplo, bootstrap usa la text-right
clase. Úselo así:
<input type="text" class="text-right"/>
<input type="number" class="text-right"/>
Como nota, esto también funciona en otros tipos de entrada, como los numéricos como se muestra arriba.
Si no está utilizando un marco agradable como bootstrap, puede crear su propia versión de esta clase auxiliar. Similar a otras respuestas, pero no vamos a agregarlo directamente a la clase de entrada, por lo que no se aplicará a cada entrada en su sitio o página, esto podría no ser el comportamiento deseado. Entonces, esto crearía una clase css fácil y agradable para alinear las cosas correctamente sin necesidad de un estilo en línea o que afecte a cada cuadro de entrada.
.text-right{
text-align: right;
}
Ahora puede usar esta clase exactamente igual que las entradas anteriores con class="text-right"
. Sé que no está guardando tantas pulsaciones de teclas, pero hace que su código sea más limpio.
Si desea alinearlo a la derecha después de que el texto pierde el foco, puede intentar usar el modificador de dirección. Esto mostrará la parte correcta del texto después de perder el foco. por ejemplo, útil si desea mostrar el nombre del archivo en una ruta grande.
input.rightAligned {
direction:ltr;
overflow:hidden;
}
input.rightAligned:not(:focus) {
direction:rtl;
text-align: left;
unicode-bidi: plaintext;
text-overflow: ellipsis;
}
<form>
<input type="text" class="rightAligned" name="name" value="">
</form>
El selector no está actualmente bien soportado: soporte de navegador
@ Html.TextBoxFor (model => model.IssueDate, new {@class = "form-control", name = "inv_issue_date", id = "inv_issue_date", title = "Seleccionar fecha de emisión de factura", marcador de posición = "dd / mm / aaaa ", estilo =" alineación de texto: centro; "})
Sin CSS: use la propiedad STYLE de la entrada de texto
STYLE = "text-align: right;"
text-align:right
es definitivamente CSS.