Foros del Web » Creando para Internet » CSS »

Problema con sprites

Estas en el tema de Problema con sprites en el foro de CSS en Foros del Web. Hola, tengo una especie de menú con Sprites y no sé porqué una de las imágenes no se muestra. El menú es de este blog, ...
  #1 (permalink)  
Antiguo 22/10/2012, 13:31
 
Fecha de Ingreso: diciembre-2008
Mensajes: 211
Antigüedad: 15 años, 3 meses
Puntos: 5
Problema con sprites

Hola, tengo una especie de menú con Sprites y no sé porqué una de las imágenes no se muestra. El menú es de este blog, lo pueden ver arriba en el sidebar: http://bdebelleza.es/

La imagen que contiene los sprites es esta: http://bdebelleza.es/social4.png

Y este es el código:

Código:
ul#marcadores{
margin: auto;
width: 200px;
}
ul#marcadores li {
list-style-type: none;
margin : 0;
padding: 0;
float: left;
}
#marcadores li a{
background: url(http://bdebelleza.es/social4.png) no-repeat 0 0;
margin: 0;
padding: 0;
display: block;
width:  40px; /*El ancho del bloque con el icono*/
height:  100px; /*El alto del bloque con el icono*/
}

#marcadores li a.facebook{
background-position: 0px -100px; /*la posición del icono de face*/
}
#marcadores li a.twitter {
background-position: -40px -100px; /*la posición del icono de twitter*/
}
#marcadores li a.youtube {
background-position: -80px -100px; /*la posición del icono de Youtube*/
}
#marcadores li a.instagram {
background-position: -120px -100px; /*la posición del icono de Instagram*/
}
#marcadores li a.rss{
background-position: -160px -100px; /*la posición del icono del feed*/
}

#marcadores li a.facebook:hover{
background-position: 0px 0px; /*la posición del icono de face del efecto hover*/
}
#marcadores li a.twitter:hover {
background-position: -40px 0px; /*la posición del icono de twitter del efecto hover*/
}
#marcadores li a.youtube:hover {
background-position: -80px 0px; /*la posición del icono de rss del efecto hover*/
}
#marcadores li a.instagram:hover {
background-position: -120px 0px; /*la posición del icono de instagram del efecto hover*/
}
#marcadores li a.rss:hover{
background-position: -160px 0px; /*la posición del ícono del Feed del efecto hover*/
}
En el lugar en el que aparece el icono de rss debería estar el de Instagram, y el de RSS a su derecha.

A ver si alguien me puede echar una mano.

Un saludo.
  #2 (permalink)  
Antiguo 22/10/2012, 13:40
Avatar de willyfc  
Fecha de Ingreso: octubre-2008
Ubicación: Santa Cruz - Bolivia
Mensajes: 662
Antigüedad: 15 años, 5 meses
Puntos: 40
Respuesta: Problema con sprites

Solo se están imprimiendo 4 <li> dentro de <ul id="marcadores"> y se ve que están las correctas, yo veo esto en el html.

Código:
<div class="textwidget">
    <ul id="marcadores">
        <li><a href="http://www.facebook.com/bdebelleza" rel="nofollow" class="facebook"  target='_blank' title="Sígueme en Facebook"></a></li>
        <li><a href="http://twitter.com/#!/BdeBelleza" rel="nofollow" class="twitter"  target='_blank' title="Sígueme en Twitter"></a></li>
        <li><a href="http://www.youtube.com/user/SuSaNNa2110" rel="nofollow" class="youtube"  target='_blank' title="Sígueme en YouTube"></a></li>
        <li><a href="http://feeds.feedburner.com/Bdebellezaes?format=xml" rel="nofollow" class="rss"  target='_blank' title="Suscribirse"></a></li>
</ul>
<br></br><br></br><br></br>
</div>
__________________
WFC
codigo82
  #3 (permalink)  
Antiguo 22/10/2012, 16:40
 
Fecha de Ingreso: diciembre-2008
Mensajes: 211
Antigüedad: 15 años, 3 meses
Puntos: 5
Respuesta: Problema con sprites

Gracias por responder.

Es raro, porque en la parte de widgets tengo puesto los 5 :S

Código:
<ul id="marcadores">

<li><a class="facebook" href="http://www.facebook.com/bdebelleza" target='_blank' title="Sígueme en Facebook"></a></li>

<li><a class="twitter" href="http://twitter.com/#!/BdeBelleza" target='_blank' title="Sígueme en Twitter"></a></li>

<li><a class="youtube" href="http://www.youtube.com/user/SuSaNNa2110" target='_blank' title="Sígueme en YouTube"></a></li>

<li><a class="instagram" href="" target='_blank' title="Sígueme en Instagram"></a></li>

<li><a class="rss" href="http://feeds.feedburner.com/Bdebellezaes?format=xml" target='_blank' title="Suscribirse"></a></li>

</ul>
  #4 (permalink)  
Antiguo 22/10/2012, 20:09
Avatar de flashmax  
Fecha de Ingreso: julio-2012
Ubicación: Bs.As. Argentina
Mensajes: 507
Antigüedad: 11 años, 8 meses
Puntos: 86
Respuesta: Problema con sprites

Hola revisa tu codigo te falto :
Código HTML:
<li><a class="instagram" href="" target='_blank' title="Sígueme en Instagram"></a></li> 
__________________
Saludos!
----------------------------------------------------------
  #5 (permalink)  
Antiguo 23/10/2012, 04:27
 
Fecha de Ingreso: diciembre-2008
Mensajes: 211
Antigüedad: 15 años, 3 meses
Puntos: 5
Respuesta: Problema con sprites

Muchas gracias, ya lo tengo puesto pero sigue sin salir...
  #6 (permalink)  
Antiguo 23/10/2012, 05:28
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.488
Antigüedad: 21 años, 7 meses
Puntos: 2114
Respuesta: Problema con sprites

¿Probaste poniendo un valor a href? Tal vez Wordpress lo deje fuera por no contener ningún enlace.
  #7 (permalink)  
Antiguo 23/10/2012, 06:16
 
Fecha de Ingreso: diciembre-2008
Mensajes: 211
Antigüedad: 15 años, 3 meses
Puntos: 5
Respuesta: Problema con sprites

Muchas gracias a todos, al final ya se ha solucionado. Tengo un plugin para el cache que al limpiarlo ya ha aparecido.

Un saludo y gracias de nuevo.

Etiquetas: ancho, hover, sprites, fondo
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




La zona horaria es GMT -6. Ahora son las 16:58.