Respostas:
Use a propriedade alinhar texto no seu CSS:
input {
text-align: right;
}
Isso entrará em vigor em todas as entradas da página.
Caso contrário, se você deseja alinhar o texto de apenas uma entrada, defina o estilo embutido:
<input type="text" style="text-align:right;"/>
Tente isso em seu CSS:
input {
text-align: right;
}
Para alinhar o texto no centro:
input {
text-align: center;
}
Mas, ele deve estar alinhado à esquerda, pois esse é o padrão - e parece ser o mais fácil de usar.
input[type=text] { text-align:right }
<form>
<input type="text" name="name" value="">
</form>
A resposta aceita aqui está correta, mas gostaria de adicionar um pouco de informação. Se você estiver usando uma biblioteca / estrutura como o bootstrap, podem ser criadas classes para isso. Por exemplo, o bootstrap usa a text-right
classe Use-o assim:
<input type="text" class="text-right"/>
<input type="number" class="text-right"/>
Como nota, isso também funciona em outros tipos de entrada, como numérico, como mostrado acima.
Se você não estiver usando uma boa estrutura como o bootstrap, poderá criar sua própria versão dessa classe auxiliar. Semelhante a outras respostas, mas não vamos adicioná-lo diretamente à classe de entrada, para que não se aplique a todas as entradas do seu site ou página; talvez esse não seja o comportamento desejado. Portanto, isso criaria uma classe css fácil e agradável para alinhar as coisas corretamente, sem a necessidade de um estilo embutido ou afetando todas as caixas de entrada.
.text-right{
text-align: right;
}
Agora você pode usar esta classe exatamente da mesma forma que as entradas acima com class="text-right"
. Eu sei que não está salvando tantas teclas, mas torna seu código mais limpo.
Se você quiser alinhar à direita depois que o texto perder o foco, tente usar o modificador de direção. Isso mostrará a parte correta do texto depois de perder o foco. por exemplo, útil se você deseja mostrar o nome do arquivo em um caminho 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>
No momento, o seletor not é bem suportado: Suporte ao navegador
@ Html.TextBoxFor (model => model.IssueDate, new {@class = "control-form", nome = "inv_issue_date", id = "inv_issue_date", id = "inv_issue_date", title = "Selecionar data de emissão da fatura", espaço reservado = "dd / mm / aaaa ", style =" alinhamento de texto: centro; "})
Sem CSS: use a propriedade STYLE da entrada de texto
STYLE = "alinhamento de texto: direita;"
text-align:right
é definitivamente CSS.