Alineación vertical y horizontal en CSS

Tengo problemas para alinear mi formulario tanto vertical como horizontalmente.

No me importa si esto no es compatible con IE, planeo implementar una secuencia de comandos de detección de IE para decirle al usuario que use un navegador diferente, pero la compatibilidad con Firefox y Chrome es imprescindible.

Esto es lo que tengo actualmente:

HTML

      

User Name :
Password :

CSS global

 #wrapper { position: relative; max-width: 1024px; height: 1000px; margin-left: auto; margin-right: auto; } #logo_div { position: relative; margin-left: auto; margin-right: auto; } #logo { display: block; position: relative; margin-left: auto; margin-right: auto; } 

Índice CSS

 #login { position: relative; margin-left: auto; margin-right: auto; } #login_form { position: relative; margin-left: auto; margin-right: auto; } 

Cualquier ayuda es apreciada. Gracias

¿Quieres algo como esto?

prueba este css

 #login{ position:absolute; left:50%; top:50%; margin-left:-120px; margin-top:-60px; border:1px solid #ccc; width:240px; height:120px; } 

Si desea un formulario centrado vertical y horizontalmente, puede usar la posición del atributo css: absoluta; y luego usar a la izquierda: 50%; arriba: 50% para alinear la esquina superior izquierda de div con el centro del navegador. Pero tu Div no se verá centrada por esto. porque está centrado en la ventana por su esquina superior izquierda. Acabo de utilizar el margen negativo con la mitad del ancho y la altura de div para centrarlo correctamente.

Espero que esto es lo que estás buscando.

Gracias Bojangles, por sugerencia!

En este momento, tu #login div usa el 100% del ancho de la página, debes establecer un ancho menor para que se pueda centrar correctamente. Y puede centrarlo verticalmente configurando la parte superior al 50% menos la altura div / 2.

Me gusta esto

 #login { position: relative; margin-left: auto; margin-right: auto; width: 300px; top: 50%; margin-top:-50px; }