Centrar capa con posicion absoluta horizontalmente

A veces, por comodidad, trabajamos con medidas absolutas que nos permiten posicionar una capa (o elemento) en una posición elegida por nosotros para así evitar los tediosos overflows innecesarios que podrían generar los float.

Si alguna vez rechazaste un position:absolute por no ser capaz de centrarlo, en esta entrada aprenderás cómo hacerlo.

Para conseguir el efecto hay que jugar con los margenes laterales (margin-left y margin-right) y, a su vez, con las propiedades absolutas left y right.

Con este código tendremos nuestra capa absoluta centrada horizontalmente:

#idDeNuestraCapa{
margin-left:auto;
margin-right:auto;
left:0;
right:0;
}

Con eso será más que suficiente y la capa quedará automáticamente centrada horizontalmente.

¡MANTENME INFORMADO!

¡Gracias por tu interés en estar informado del próximo lanzamiento de mis cursos! 😎

¡No hago spam! Lee la política de privacidad para tener más información.

8 comentarios en “Centrar capa con posicion absoluta horizontalmente”

  1. No consigo que se centre con ese código. Tengo la web, con varias capas en absolute, y una capa absolute que las engloba a todas, ahora lo que intento es centrar esa capa para las diferentes resoluciones, pero no hay manera. Sabes cómo se puede hacer? Gracias
    Un saludo

    Responder

  6. Buenas tardes!
    Me funcionó a la perfección!!! De verdad te agradezco porque me estaba volviendo loco intentando centrar un pie de página que tenía en absolute.
    Saludos de Colombia :) !

    Responder

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

*

*

DARÍO BALBONTÍN FERNÁNDEZ es el Responsable del tratamiento de los datos personales del usuario y le informa que estos datos serán tratados de conformidad con lo dispuesto en el Reglamento (UE) 2016/679 de 27 de abril (GDPR) y la Ley Orgánica 3/2018 de 5 de diciembre (LOPDGDD), por lo que se le facilita la siguiente información del tratamiento: Fin del tratamiento: mantener una relación comercial y el envío de comunicaciones sobre nuestros productos y servicios. Criterios de conservación de los datos: se conservarán mientras exista un interés mutuo para mantener el fin del tratamiento y cuando ya no sea necesario para tal fin, se suprimirán con medidas de seguridad adecuadas para garantizar la seudonimización de los datos o la destrucción total de los mismos.Comunicación de los datos: No se comunicarán los datos a terceros, salvo obligación legal. Derechos que asisten al usuario: Derecho a retirar el consentimiento en cualquier momento. Derecho de acceso, rectificación, portabilidad y supresión de sus datos y a la limitación u oposición al su tratamiento. Derecho a presentar una reclamación ante la Autoridad de control (agpd.es) si considera que el tratamiento no se ajusta a la normativa vigente. Datos de contacto para ejercer sus derechos: contacto@dariobf.com.