CSS: centrar un div con tamaño absoluto
Cuando trabajamos con tamaños absolutos (position: absolute) no es sencillo centar un div en la página. Esta es una opción para un div de 300x200 pixels:
div {
position: absolute;
left: 50%;
top: 50%;
width: 300px;
height: 200px;
margin-top: -100px; /* mitad de la altura */
margin-left: -150px; /* mitad del ancho */
overflow: auto;
border: 1px solid red;
}
position: absolute;
left: 50%;
top: 50%;
width: 300px;
height: 200px;
margin-top: -100px; /* mitad de la altura */
margin-left: -150px; /* mitad del ancho */
overflow: auto;
border: 1px solid red;
}
Información detallada:
http://www.programacionweb.net/articulos/articulo/?num=461
Para el caso de querer centrar un div no absoluto podríamos hacer lo siguiente:
- Crear un div que ocupe el 100%
- Ponerle tex-align:center;
- Dentro de ese div insertar otro del tamaño que sea
- Poner a este segundo div margin-left:auto; margin-right:auto;
2 comentarios:
Gracias por la data
estoy empezando a utilizar css y la verdad es que se me esta complicando un poco
pero bue
todo a la larga se aprende dicen
saludos
Camaro.-
muchas muchasssssssss gracias, busque por hs y esta fue la que resultó!
Romina
Publicar un comentario