Foros del web, para los que viven de bits

Enjuto · 24-may-2008, 17:57

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 · 26-may-2008, 00:59

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

jilguerogabriel · 26-may-2008, 08:24

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 · 26-may-2008, 08:31

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 · 26-may-2008, 10:20

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 · 27-may-2008, 07:29

Cita:

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).

24-may-2008, 17:57	#1 (permalink)
Enjuto Fecha de Ingreso: marzo-2008 Mensajes: 12	Problemas con un div en Firefox 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?

26-may-2008, 00:59	#2 (permalink)
pateketrueke Fecha de Ingreso: abril-2008 Ubicación: Mexihco-Tenochtitlan Mensajes: 3.170	Respuesta: Problemas con un div en Firefox claro.... solo mete la primer <img/> igual ke la segunda.-.... dentro del div... suerte! __________________ == Tiempo por Energía es Igual a Arte ==

26-may-2008, 08:24	#3 (permalink)
jilguerogabriel Fecha de Ingreso: mayo-2008 Mensajes: 119	Respuesta: Problemas con un div en Firefox Tienes que cerrar cada imagen, colocaste dos imagenes en tu div, por lo tanto donde quieres que se cierre la primera imagen coloca "<img/>"

26-may-2008, 08:31	#4 (permalink)
MRB08 Fecha de Ingreso: febrero-2008 Ubicación: Argentina, Santa Fe, Rosario Mensajes: 305	Respuesta: Problemas con un div en Firefox 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 __________________ Desarrollo web en el acto.

26-may-2008, 10:20	#5 (permalink)
pateketrueke Fecha de Ingreso: abril-2008 Ubicación: Mexihco-Tenochtitlan Mensajes: 3.170	Respuesta: Problemas con un div en Firefox 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> __________________ == Tiempo por Energía es Igual a Arte ==

27-may-2008, 07:29	#6 (permalink)
Enjuto Fecha de Ingreso: marzo-2008 Mensajes: 12	Respuesta: Problemas con un div en Firefox Cita: 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). Última edición por Enjuto; 27-may-2008 a las 11:26.

Herramientas
Mostrar Versión Imprimible Enviar por Correo
Desplegado
Mode Lineal Cambiar a Modo Hibrido Cambiar a Modo Hilado