Estoy utilizando div's y quiero centrar una caja para colocar dentro mi login, pero quiero que la caja esté centrada tanto horizontalmente como verticalmente, según la resolución o tamaño del monitor que se esté utilizando.
Cómo hago esto??
| |||
Respuesta: Centrar un div en cualquier resolucion Horizontalmente puedes hacer -> margin: 0 auto; o div align="center", verticalmente es un poco más complicado, puedes usar porcentajes de margin-top, o una hoja de estilo para cada resolución. Un saludo! |
| |||
Respuesta: Centrar un div en cualquier resolucion A ver si esto te sirve: CSS #caja1 {display: table; height: 200px; border: 1px solid #f00; position: relative;width: 200px;} #caja2 {display: table-cell; vertical-align: middle;} #caja3 {border: 1px solid #0f0; position: relative;} PARA Internet Explorer: (lo puedes poner en una css aparte con comentarios condicinales) #caja2 {position: absolute; top: 50%;} #caja3 {top: -50%;} HTML <div id="caja1"> <div id="caja2"> <div id="caja3"> CONTENIDO DE TU WEB </div> </div> </div> |
| |||
Respuesta: Centrar un div en cualquier resolucion ¿Esa caja es de dimensiones conocidas a priori o se desconocen? ¿Qué navegadores y versiones debe abarcar, especialmente de ie? De ello depende los códigos a utilizar. |
| |||
![]() Creo que deberías leer este artículo, creo que te puede ayudar al igual que algunos de las respuestas que ya te han dado. [URL="http://www.csslab.cl/2007/01/12/centrado-vertical-con-css/"]http://www.csslab.cl/2007/01/12/centrado-vertical-con-css/[/URL] ![]() |
| ||||
![]() Gracias por todas las respuestas. Lo que quiero hacer es poner en el centro de la pantalla una caja para el login de mi sistema. Y quiero hacerlo centrado, o por lo menos lo más centrado posible. No tengo una medida exacta de la caja login, pero debería poder centrarse cierto? Como el login de Joomla o algún otro sistema. Y no debería depender del navegador, pues si un programador hace un sistema para internet, debe considerar que se utilicen todos los navegadores más populares, cierto?? ![]() ![]() |
Etiquetas: Ninguno |