Problemas con un div en Firefox

[Enjuto]

Hola.

Muy a pesar mío (odio ser tan torpe en algo y llegar a resultar molesto), me veo en la necesaria situación de pedir ayuda una vez más (ya van tres...).

Mi problema es el siguiente:

Para crear un efecto de imagen de fondo completa, en la que pueda variar el tamaño en función del contenido, he optado por usar dos imágenes fijas (inicio y fin) y poner la del centro como fondo del elemento, de la siguiente manera:

Código HTML:

<img src="IMAGEN SUPERIOR"/><div style="background-image: url(IMAGEN DE FONDO);">Aquí va el contenido<img src="IMAGEN INFERIOR"/></div> 

Con Explorer todo funciona perfectamente. Pero al visionarlo en Firefox, entre la imagen superior y la de fondo queda un pequeño espacio.

Investigando sobre el tema he imaginado que es por el div. ¿Alguien conoce algún modo de solventar este problema?

[pateketrueke]

claro.... solo mete la primer <img/> igual ke la segunda.-.... dentro del div... suerte!

[jilguerogabriel]

Tienes que cerrar cada imagen, colocaste dos imagenes en tu div, por lo tanto donde quieres que se cierre la primera imagen coloca "<img/>"

[MRB08]

Mirá te queda asi:

Código HTML:

<img src="IMAGEN SUPERIOR" /><div style="background-image: url(IMAGEN DE FONDO);">Aquí va el contenido<img src="IMAGEN INFERIOR" /></div> 

Si tenés algún problemas avisame

Salu2 tu amigo MRB08

[pateketrueke]

yo decia... ke era asa

Código HTML:

<div style="background-image: url(IMAGEN DE FONDO);">
  <img src="IMAGEN SUPERIOR" />
  
  Aquí va el contenido
  
  <img src="IMAGEN INFERIOR" />
</div> 

[Enjuto]

Iniciado por pateketrueke

yo decia... ke era asa

Código HTML:

<div style="background-image: url(IMAGEN DE FONDO);">
  <img src="IMAGEN SUPERIOR" />
  
  Aquí va el contenido
  
  <img src="IMAGEN INFERIOR" />
</div> 

Esto solucionó el problema del espacio entre imágenes, pero a precio de que se vea la "imagen de fondo" detrás de la "imagen superior", ya que ésta tiene el fondo transparente (pero sólo en la parte de arriba).