Alinear texto a la derecha

Actualmente estamos desarrollando una aplicacion sobre php que trabaja con cantidades numericas dentro de cajas de texto pero nos solicitaron alinear...

La FAQ Alinear texto a la derecha tiene

Pertenece a la categoría:
Pregunta
Actualmente estamos desarrollando una aplicacion sobre php que trabaja con cantidades numericas dentro de cajas de texto pero nos solicitaron alinear el contenido de las cajas a la derecha. Alguien conoce alguna forma de poder alinear el contenido de la caja de texto (text) a la derecha.




un saludo y muchas gracias
Respuesta de Marco Antonio Camarena
Hay una forma muy sencilla de lograr esto y es por medio de hojas de estilo (CSS).


Mira, un código de ejemplo es:




<input type="text" style="text-align:right" value="prueba" />




el text-align del style te permite alinear hacia la derecha.

Volver al árbol de categoríasVolver al árbol de categorías

Comentarios

Roger

15/3/2007
También se puede hacer uso de estilos de la manera siguiente:

<style type="text/css">
#id_der {
text-align:right;
font-weight:bold;
}
</style>
</head>

<body>
<input id="id_der" type="text" value="1,000.00" />
</body>

Esto permite que todos los input que tengan id="id_der" se comporten de la misma manera, es decir con el contenido alineado a la derecha (adicionalmente le puse letra negrita).

Otra manera de hacerlo es haciendo el uso de clases en la hoja de estilo:

<style type="text/css">

.class_derecha {
text-align:right;
background="CC99FF";
}
</style>
</head>

<body>
<input id="id_der" type="text" value="1,000.00">
<input id="id_der" type="text" value="2,000.00"><br>
<input class="class_derecha" type="text" value="3,000.00" />
<input class="class_derecha" type="text" value="4,000.00" />

</body>

Observa que, en la hoja de estilo, para crear un id se antepone el carácter #, mientras que para una clase se antepone un punto (.); pero en el elemento al que se le va a asignar el id o la clase no se coloca ninguno de estos caracteres.

MoRDi

15/3/2007
para incluir en una hoja de estilo aparte, y asi mantener la separacion entre informacion y diseño, tan importante en la programacion estructurada, deberias incluir este codigo

* input[type="text"]{
text-align: right;
}
y si es un campo password el que quieres alinear pues:

* input[type="password"]{
text-align: right;
}

siempre puedes añadir la caracteristica padding-right: 2px; para que no comience a escribir justo al filo, lo que deja el input un poco mas vistoso

yenifer

22/3/2013
tareas
gracias por ayudarnos a encontrar tareas en esta pagina
FAQ relacionadas

Para ver más FAQ relacionadas accede a las categorías:

Volver al árbol de categoríasVolver al árbol de categorías