Foros del Web » Creando para Internet » CSS »

enlace con imagen de fondo que no se ve, AYUDA!!!

Estas en el tema de enlace con imagen de fondo que no se ve, AYUDA!!! en el foro de CSS en Foros del Web. Hola amigos del foro, tengo un problema: El siguiente codigo CSS no funciona en IE6, he probado todo y no se solucionarlo... Código HTML: /* ...
  #1 (permalink)  
Antiguo 07/04/2008, 14:25
 
Fecha de Ingreso: febrero-2004
Mensajes: 446
Antigüedad: 20 años, 9 meses
Puntos: 0
enlace con imagen de fondo que no se ve, AYUDA!!!

Hola amigos del foro, tengo un problema:

El siguiente codigo CSS no funciona en IE6, he probado todo y no se solucionarlo...

Código HTML:
	/* estilos enlaces caja_submenu ---> */
	.caja_submenu li a.e3:link, .caja_submenu li a.e3:visited{
		text-decoration:none;
		color:#666666;
	}
	.caja_submenu li a.e3:hover{
		text-decoration:none;
		background-image:url(../img/fondo_btn_03_tramado.png);
		padding:0px 0px 0px 0px;
		display:block;
		color:#000000;
		font-weight:bold;
		
	}
	/* fin lista y estilos enlaces caja_submenu ---> */
Aquí os dejo dos imagenes para que veáis la diferencia..:


(COn internet explorer al pasar el raton por encima)


(Con firefox, opera, safari, al pasar el raton por encima...)


Alguien Me ayuda por favor???
  #2 (permalink)  
Antiguo 07/04/2008, 15:04
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 18 años, 1 mes
Puntos: 280
Re: enlace con imagen de fondo que no se ve, AYUDA!!!

Hola, walvaRo.

Una pregunta: ¿el archivo de imagen qué usas de fondo al pasar el ratón tiene algún tipo de transparencia? Lo digo porque puede que el problema esté en que es un archivo .png, que si tiene algún tipo de transparencia siempre da problemas con IE6.

Mikel.
  #3 (permalink)  
Antiguo 07/04/2008, 16:03
 
Fecha de Ingreso: febrero-2004
Mensajes: 446
Antigüedad: 20 años, 9 meses
Puntos: 0
Re: enlace con imagen de fondo que no se ve, AYUDA!!!

No Mikmoro, no tiene ningun tipo de transparencia, es un PNG 8 a 256 colores sin transparencia, ademas la imagen es cuadrada...

Alguien puede ayudarme??? ... Incluso utilizo un "RESET" de css para hacer las cosas bien desde el principio...

Ayuda porfavor !!!
  #4 (permalink)  
Antiguo 07/04/2008, 17:12
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 18 años, 1 mes
Puntos: 280
Re: enlace con imagen de fondo que no se ve, AYUDA!!!

Pues vaya, qué raro. Yo aplico tu código y se ve perfectamente. Sería mejor que pusieras todo el código html y css o un enlace para verlo, porque el error debe de estar en alguna otra parte.

Mikel.
  #5 (permalink)  
Antiguo 08/04/2008, 01:16
 
Fecha de Ingreso: febrero-2004
Mensajes: 446
Antigüedad: 20 años, 9 meses
Puntos: 0
Re: enlace con imagen de fondo que no se ve, AYUDA!!!

De que juego hablas???


Nadie podría ayudarme porfavor?

saludos!
  #6 (permalink)  
Antiguo 08/04/2008, 01:19
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 18 años, 1 mes
Puntos: 280
Re: enlace con imagen de fondo que no se ve, AYUDA!!!

Repito: si tan desesperado estás por resolverlo, pon un enlace donde verlo funcionando para intentar encontrar el error. El error no está en el código que has puesto, que por sí sólo funciona bien. Falla en combinación con algo más.

Mikel.
  #7 (permalink)  
Antiguo 08/04/2008, 12:41
 
Fecha de Ingreso: febrero-2004
Mensajes: 446
Antigüedad: 20 años, 9 meses
Puntos: 0
Re: enlace con imagen de fondo que no se ve, AYUDA!!!

Hola amigos del foro, hasta ahora no tenia acceso a mi css, pero ya estoy en el pc en el q lo tengo...

Aquí dejo el css que he diseñado..., tendrá partes mal partes bien, etc... el tema es que la página valida bien: "This Page Is Valid XHTML 1.0 Transitional!"

Bueno aqui dejo el css a ver si alguien le ve el fallo que busco, aunque se que encontraréis otros que no vienen al caso... A mi lo que me interesa es descubrir POR QUE en IE se ve mal y en el resto de navegadores se ve Bien...

AYUDA PORFAVOR !!!

Código PHP:
body{
    
background-color:#ffffff;
    
font-family:ArialVerdanaHelveticasans-serif;
    
font-size:12px;
    
color:#FFFFFF;
}

/* ------------------ */
/* Estructura ------> */
/* ------------------ */
#todo{
    
height:auto;
    
width:100%;
}
/* Diseño cabecera ------> */
#header{
    
top:0px;
    
left:0px;
    
height:210px;
    
width:100%;
}
#fondo_cabecera{
    
background-image:url(../img/fondo_cabecera_01.png);
    
background-repeat:repeat-x;
    
background-position:top;
    
background-position:left;
    
background-colortransparent;
    
position:absolute;
    
left:0px;
    
top:0px;
    
margin-right:0px;
    
height:180px;
    
width:100%;
    
z-index:0;
    }
#logo_cabecera{
    
background-image:url(../img/ballonti_logo_cabecera.png);
    
background-repeat:no-repeat;
    
background-position:left;
    
background-position:top;
    
background-colortransparent;
    
position:absolute;
    
left:220px;
    
top:30px;
    
height:90px;
    
width:270px;
    
z-index:2;
    }
#seleccion_idioma{
    
position:absolute;
    
left:525px;
    
top:100px;
    
height:15px;
    
width:130px;
    
z-index:3;
    }
    
/* lista seleccion_idioma ---> */
    #seleccion_idioma ul{
        
list-style:none;
        
margin:0px;
        
padding:0px;
    }
    
#seleccion_idioma li{
        
displayinline;
        
padding:0px;
        
margin:0px;
    }
    
/* estilos enlaces menu_principal ---> */
    #seleccion_idioma li a.e2:link, #seleccion_idioma li a.e2:visited{
        
text-decoration:none;
        
background-image:url(../img/fondo_btn_01.png);
        
background-position:left;
        
background-position:top;
        
color:#000000;
        
padding:0px 5px 0px 5px;        
    }
    
#seleccion_idioma li a.e2:hover{
        
text-decoration:none;
        
background-image:url(../img/fondo_btn_02.png);
        
background-position:left;
        
background-position:top;
        
color:#ffffff;
        
padding:0px 5px 0px 5px;        
    }
    
/* fin lista y estilos enlaces menu_principal ---> */
    
#flechita_fondo_menu_principal{
    
background-image:url(../img/flechita_fondo_menu_principal.png);
    
background-repeat:no-repeat;
    
background-position:left;
    
background-position:top;
    
background-color:transparent;
    
position:absolute;
    
left:50px;
    
top:150px;
    
height:60px;
    
width:40px;
    
z-index:3;
    }
#menu_principal{
    
background-image:url(../img/fondo_menu_01.png);
    
background-repeat:repeat;
    
background-position:left;
    
background-position:top;
    
background-colortransparent;
    
border-bottom:1px solid;
    
border-right:1px solid;
    
border-color:#dae5eb;
    
position:absolute;
    
left:50px;
    
top:150px;
    
height:60px;
    
width:600px;
    
font-size:13px;
    
line-height:11px;
    
z-index:2;
    }

    
/* lista menu_principal ---> */
    #menu_principal ul{
        
list-style:none;
        
margin:0px;
        
padding:12px 0px 0px 50px;
        
    }
    
#menu_principal li{
        
displayinline;
        
padding:0px;
        
margin:0px;
    }
    
/* estilos enlaces menu_principal ---> */
    #menu_principal li a:link, #menu_principal li a:visited{
        
color:#ffffff;
        
text-decorationnone;
        
    }
    
#menu_principal li a:hover{
        
color:#000000;
        
text-decorationnone;
    }    
    
/* fin lista y estilos enlaces menu_principal ---> */

/* FIN Diseño cabecera ------> */

/* Diseño ZONA CUERPO ------> */
#zona_cuerpo{
    
top:200px;
    
left:0px;
    
height:auto;
    
width:100%;
}
/* INICIO Diseño caja_submenu ---> */
.caja_submenu {
    
background-image:url(../img/fondo_generico_caja.png);
    
border-bottom:1px solid;
    
border-right:1px solid;
    
border-color:#dae5eb;
    
border-top:6px solid #000000; !important
    
position:relative;
    
padding-top:30px;
    
padding-right:0px;
    
padding-left:10px;
    
padding-bottom:10px;
    
margin-left:680px;
    
margin-top:0px;
    
margin-bottom:20px;
    
width:200px;
    
overflow:hidden;
    
clear:left;
}
        
/* lista caja_submenu ---> */
    
.caja_submenu ul{
        
margin:0px;
        
padding:0px 0px 0px 22px;
        
line-height:16px;
    }
    .
caja_submenu li{
        
border-top:1px dotted #dae5eb;
        
list-style:none;
    }
    
/* estilos enlaces caja_submenu ---> */
    
.caja_submenu li a.e3:link, .caja_submenu li a.e3:visited{
        
text-decoration:none;
        
color:#666666;
    
}
    .
caja_submenu li a.e3:hover{
        
text-decoration:none;
        
background-image:url(../img/fondo_btn_03_tramado.png);
        
float:none;
        
display:block;
        
color:#000000;
    
}
    
/* fin lista y estilos enlaces caja_submenu ---> */
/* FIN Diseño caja_submenu ---> */

/* Textos ------> */
.texto_negro01{
    
color:#000000;
}
.
titulo_azul{
    
font-family:ArialHelveticasans-serif;
    
font-size:14px;
    
font-weight:bold;
    
color:#0793cd;

  #8 (permalink)  
Antiguo 08/04/2008, 13:47
 
Fecha de Ingreso: enero-2008
Mensajes: 19
Antigüedad: 16 años, 10 meses
Puntos: 0
Re: enlace con imagen de fondo que no se ve, AYUDA!!!

Hi !

Si la imagen no es de tamaño "variable" yo pondria (Especificaria) un ancho y un alto para la caja, porque el :

display:block;

Siempre va acompañado de "width" y "height" (En la medida de lo posible).

Prueba eso, Suerte!

-ByE-
  #9 (permalink)  
Antiguo 08/04/2008, 14:23
 
Fecha de Ingreso: febrero-2004
Mensajes: 446
Antigüedad: 20 años, 9 meses
Puntos: 0
Re: enlace con imagen de fondo que no se ve, AYUDA!!!

Oh MARAVILLA !!!!!!!!!
HA FUNCIONADO UN SIMPLE PAR DE ATRIBUTOS DE ALTO Y ANCHO QUE NI SE ME HABIAN PASADO POR LA CABEZA!!!!


Sies que soy un cateto de otra esfera !!! jajaja xD

MIL TRILLONES DE GRACIAS !!!
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 21:32.