¿ Centrar imagen horizontalmente y verticalmente dentro de un div ?

[davidj]

Hola a todos,

Me gustaría saber como centar una imagen horizontalmente y verticalmente dentro de un div, es decir, poner una foto con tamaño determinado dentro de un <div> de, por ejemplo, 400x 300 pixeles.

Se trata de que la imagen sea del tamaño que sea quede siempre centrada en dicho rectangulo (tanto horizontal como vertical).

¿ Alguna idea ?

[abimaelrc]

Tu problema ya no es con PHP, vas a tener que esperar que un moderador te mueva al foro correspondiente. Una forma de lograr lo que pides es usar en CSS vertical-align y text-align. Pero para que vertical-align funcione debes indicarlo en una caja que sea tipo inline. Si vas a usar div debes hacer algo como

Código HTML:

<style>
#wrap{
    width: 400px;
    height: 300px;
    display: table;
    border: 2px solid #cccccc;
}
#content{
    width: 100%;
    height: 100%;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}
</style>
<div id="wrap">
    <div id="content">foo bar baz</div>
</div>
 

[davidj]

Gracias por tu ayuda!, pero esto sería similar a tablas verdad?

Un saludo!!!

[abimaelrc]

Asi es. Solo que en vez de evitar usar table para marquetar se usa div.