EspañolDeutschFrançaisItalianoPortuguêsРусскийΕλληνικά日本語中文(简体)हिन्दी; हिंदीالعربية
PF Preguntas - Foro

Cómo centrar horizontalmente una imagen, con posición absoluta, dentro de un div

Programación CSS
Cómo centrar horizontalmente una imagen, con posición absoluta, dentro de un div

La idea es centrar dentro de un DIV, una imagen con posicionamiento absoluto { position: absolute; }. Para ello, lo primero de todo es asignar, al div que va a contener la imagen, un posicionamiento relativo, evitando así que el posicionamiento absoluto de la imagen sea con respecto al elemento contenedor padre que tenga posicionamiento relativo más próximo, o en su defecto, al body.

Suponiendo que tenemos el siguiente código con un div y una imagen dentro del mismo:

El estilo a aplicar al contenedor y a la imagen es el siguiente:

Para ver el resultado con algo de ejemplo, vamos a modificar el código del HTML asignando un borde y un tamaño al div, así como agregando una ruta y un tamaño a la imagen. Quedaría algo así:

y, a continuación, el resultado:

 

Únete al canal de Telegram

Déjanos un comentario o entra al  Foro
Compártelo Share on FacebookTweet about this on TwitterShare on Google+Pin on PinterestShare on RedditShare on VKShare on StumbleUponShare on TumblrShare on LinkedInEmail this to someonePrint this page

Artículos relacionados

Deja un comentario

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