Foros del Web » Diseño web » CSS »

Centrar en el centro exacto un formulario

Estas en el tema de Centrar en el centro exacto un formulario en el foro de CSS en Foros del Web. Hola que hay? Quiero hacer un formulario de registro en una página con diversos campos y estructurarlo como lo hace actualmente hotmail: Adjunto foto: http://img31.imageshack.us/img31/3905/registrou.png ...
  #1 (permalink)  
Antiguo 20/03/2010, 19:51
 
Fecha de Ingreso: marzo-2010
Mensajes: 35
Antigüedad: 4 años, 4 meses
Puntos: 0
Centrar en el centro exacto un formulario

Hola que hay?

Quiero hacer un formulario de registro en una página con diversos campos y estructurarlo como lo hace actualmente hotmail:
Adjunto foto:
http://img31.imageshack.us/img31/3905/registrou.png


CENTRAR los campos de texto en el centro exacto de la web.
A los dos lados situar las etiquetas (izquierda) y unas ventanitas de ayuda a la derecha.

Pues bien, mi mayor quebradero de cabeza esta en como consigo hacer esto!

-He probado a meter todo en un div y centrarlo con el "text-align" pero centra al conjunto caja de texto/label
-Si meto solo los cuadros de texto en un div, no se me ocurre la forma de hacerlo.

P.D. No he empezado hace mucho con esto pero he probado bastantes cosas y no se me ocurre ya!

Gracias!
  #2 (permalink)  
Antiguo 20/03/2010, 21:17
Avatar de Carlangueitor
Moderador ლ(ಠ益ಠლ)
 
Fecha de Ingreso: marzo-2008
Ubicación: México
Mensajes: 8.800
Antigüedad: 6 años, 4 meses
Puntos: 1166
Respuesta: Centrar en el centro exacto un formulario

Amigo si hubieras usado el buscador del foro o en google "centrar con CSS" supieras que se hace con: margin: 0 auto;

Saludos
__________________
Aprender sin pensar es inútil. Pensar sin aprender, peligroso.
  #3 (permalink)  
Antiguo 21/03/2010, 06:16
 
Fecha de Ingreso: marzo-2010
Mensajes: 35
Antigüedad: 4 años, 4 meses
Puntos: 0
Respuesta: Centrar en el centro exacto un formulario

Si, vale, pero como hago para situar las <label> JUSTO unos pixeles a la izquierda de cada cuadro de texto y que su alineacion sea derecha, es decir, como en la imagen que puse.

Con margin 0 auto centro el div donde estan los cuadros de texto, pero no los cuadros de texto! para esto tengo que usar el text-align="center"

Ademas, como hago para que el tamaño del div sea justo el del cuadro de texto? ya que el cuadro de texto se mide en numero de caracteres y el div en pixeles por ejemplo... ¿tengo que estar haciendolo a ojo?... no creo que esa sea la forma.

Sigo con este pequeño problema y no lo consigo resolver!
  #4 (permalink)  
Antiguo 22/03/2010, 04:53
 
Fecha de Ingreso: marzo-2010
Mensajes: 35
Antigüedad: 4 años, 4 meses
Puntos: 0
Respuesta: Centrar en el centro exacto un formulario

¿Nadie sabe?

Si seguro que no es dificil pero no encuentro lo que busco... en todas las paginas que busco ponen la etiqueta por ahi perdida, no exactamente donde yo quiero...
  #5 (permalink)  
Antiguo 22/03/2010, 11:00
Avatar de Carlangueitor
Moderador ლ(ಠ益ಠლ)
 
Fecha de Ingreso: marzo-2008
Ubicación: México
Mensajes: 8.800
Antigüedad: 6 años, 4 meses
Puntos: 1166
Respuesta: Centrar en el centro exacto un formulario

Puedes centrar los labels directamente (con su margin respectivo si lo necesitan) individualmente.

Saludos
__________________
Aprender sin pensar es inútil. Pensar sin aprender, peligroso.
  #6 (permalink)  
Antiguo 22/03/2010, 12:23
 
Fecha de Ingreso: febrero-2008
Mensajes: 38
Antigüedad: 6 años, 5 meses
Puntos: 0
Respuesta: Centrar en el centro exacto un formulario

en el label pones text-align: right

añades padding-left para separa un poco el input y listo
  #7 (permalink)  
Antiguo 22/03/2010, 18:14
 
Fecha de Ingreso: marzo-2010
Mensajes: 35
Antigüedad: 4 años, 4 meses
Puntos: 0
Respuesta: Centrar en el centro exacto un formulario

Bien, veamos.... os agradezco vuestras respuestas pero a ver... estoy empezando en esto y o sois mas explicitos... o de poco me voy a enterar

Es que encuentro vuestras respuestas algo ambiguas y no se todavia donde tengo que meter todo:

A carlangueitor:

Puedo centrar los label individualmente... si, correcto... pero los centro estando donde... en un div? en el form? en un div dentro del form? dentro del mismo div donde deberian estar los cuadros de texto?

a Trypat:

Si, pongo eso en el label... pero y el label donde esta¿? en un div, en el form... en el mismo div de los cuadros de texto?

Y que hay acerca de los cuadros de texto? sigo sin saber como hacerlo:

1) Si meto los input solos en un div se centran genial... ¿pero como hago para que las label queden justo a la izquierda?

a) Las meto en el mismo div?
b) las dejo fuera del div?
c) las meto en otro div el cual esta a la izquierda del div de los cuadros de texto?

2) Si meto las label en el mismo div que los cuadros de texto, lo que se centra es el conjunto label-cuadro de texto, y yo no quiero esto!!

Puf, de verdad que si sabeis hacerlo por favor contestadme EXPLICITAMENTE porque me estoy volviendo loco!

En serio, os agradezco mucho vuestras respuestas pero es que no me entero de nada....
  #8 (permalink)  
Antiguo 22/03/2010, 21:29
Avatar de daPhyre
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: [email protected] (Redirects to 127.0.0.1)
Mensajes: 2.405
Antigüedad: 6 años, 4 meses
Puntos: 142
Respuesta: Centrar en el centro exacto un formulario

Prueba mostrar una imagen de como se ve y una de como quieres que se vea, eso suele ser efectivo
__________________
<signs>daPhyre</signs>
Jugaa.me


Adios al dolor de cabeza de IE...
  #9 (permalink)  
Antiguo 23/03/2010, 13:38
 
Fecha de Ingreso: marzo-2010
Mensajes: 35
Antigüedad: 4 años, 4 meses
Puntos: 0
Respuesta: Centrar en el centro exacto un formulario

Lo de la imagen de como quiero que se vea es esta:

http://img31.imageshack.us/img31/3905/registrou.png

Y como se me ve, pues depende de como lo hago.

Si pongo el margin:0 auto ese, no consigo poner el label a la misma altura que el cuadro de texto, se queda encima o debajo.

Si no lo pongo, no consigo centrarlo JUSTO en el centro aunque si consigo que queden a la misma altura....
Gracias!
  #10 (permalink)  
Antiguo 24/03/2010, 16:07
 
Fecha de Ingreso: marzo-2010
Mensajes: 35
Antigüedad: 4 años, 4 meses
Puntos: 0
Respuesta: Centrar en el centro exacto un formulario

Pues nada... veo que nadie sabe ayudarme :(
  #11 (permalink)  
Antiguo 24/03/2010, 20:03
Avatar de daPhyre
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: [email protected] (Redirects to 127.0.0.1)
Mensajes: 2.405
Antigüedad: 6 años, 4 meses
Puntos: 142
Respuesta: Centrar en el centro exacto un formulario

JAjaja!!! Ese está medido XP

Teoría: contenedor de 600px, caja de texto de 100px,

600/2 - 100/2 = 250.

Por tanto, hacer labels de 250px de ancho y con text-align:right.

Creo que eso elimina ya todo problema
__________________
<signs>daPhyre</signs>
Jugaa.me


Adios al dolor de cabeza de IE...
  #12 (permalink)  
Antiguo 31/03/2010, 11:04
 
Fecha de Ingreso: marzo-2010
Mensajes: 35
Antigüedad: 4 años, 4 meses
Puntos: 0
Respuesta: Centrar en el centro exacto un formulario

Bien, me has dado la pista sobre como tenia que hacerlo y es que me faltaba de saber una cosa:

Que se puede definir la anchura de los cuadros de texto en pixeles mediante css.
Era algo que no sabia y por eso nunca me quedaba centrado exactamente!.

Por si a alguien le interesa lo que he hecho ha sido.

Hacer un div de... 600px por ejemplo y centrarlo con margin:0 auto
Poner los cuadros de texto de 200px cada uno
Poner a la izquierda de cada cuadro de texto una label de 200px de tamaño con text-align right y... MUY IMPORANTE: float:left; y asi me ha quedado perfectisimamente centrado.

Muchas gracias!
  #13 (permalink)  
Antiguo 01/04/2010, 03:38
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.456
Antigüedad: 12 años
Puntos: 361
Respuesta: Centrar en el centro exacto un formulario

Hola:

Cita:
Iniciado por danyof Ver Mensaje
Bien, me has dado la pista sobre como tenia que hacerlo y es que me faltaba de saber una cosa:

Que se puede definir la anchura de los cuadros de texto en pixeles mediante css.
Era algo que no sabia y por eso nunca me quedaba centrado exactamente!.
Por si aparece alguna otra cosa que te falte saber:

www.librosweb.es

Saludos.

  #14 (permalink)  
Antiguo 01/04/2010, 07:22
 
Fecha de Ingreso: marzo-2010
Mensajes: 35
Antigüedad: 4 años, 4 meses
Puntos: 0
Respuesta: Centrar en el centro exacto un formulario

Gracias, parece interesante esa web.

La echare un vistazo :D

Etiquetas: centro, exacto, formulario
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 17:48.
SEO by vBSEO 3.3.2