Hola,
antes que nada,
Javiercc tiene razón: con todo respeto, tu código es muy desordenado, y resulta difícil resolver tu problema sin crear uno nuevo.
Ahora, con tu problema. Una imagen (<img />) es un elemento en línea (inline); significa que no tiene por qué seguir el modelo de cajas. En pocas palabras, los conceptos de margen y relleno (padding) no necesariamente tienen sentido con ella. Para una solución, imagínate que el <div> y la imagen conflictivos vienen en el siguiente código:
Código HTML:
<div id='uno'>
<img src='img1.jpg' />
</div>
supongamos también que la imagen mide 120px de alto (el ancho no interesa) y que la quieres centrada. El CSS para arreglarlo sería
Código:
#uno{
background: url(img1.jpg) no-repeat center;
height: 120px;
}
Pero, si la imagen ya viene como fondo, es inútil tenerla aparte dentro del contenido; entonces, hay que eliminarla:
Código HTML:
<div id='uno'>
</div>
El espacio explícito es para conservar la validación; no puede haber un <div> vacío. Por cierto, por brevedad no incluí otros elementos necesarios (como el
alt en la imagen original). Sé que esto funciona porque lo probé con el inspector de Firefox.
Por último, nunca confíes en Explorer, aunque parezca que es el que hace lo que quieres.
saludos
