Foros del Web » Creando para Internet » CSS »

Cree una capa flotante y no se ven los botones

Estas en el tema de Cree una capa flotante y no se ven los botones en el foro de CSS en Foros del Web. Quiero hacer en un sitio que estoy trabajando una barra flotante con íconos de social media. Probé el código en el Dreamweaver localmente y funcionó. ...
  #1 (permalink)  
Antiguo 26/03/2011, 07:24
 
Fecha de Ingreso: febrero-2011
Mensajes: 11
Antigüedad: 13 años, 10 meses
Puntos: 0
Cree una capa flotante y no se ven los botones

Quiero hacer en un sitio que estoy trabajando una barra flotante con íconos de social media. Probé el código en el Dreamweaver localmente y funcionó. Pero cuando meto el código en Joomla, sólo se ven los puntos de la lista con la que quiero hacer el menú. Lo estoy tratando de hacer con sprites. Cabe aclarar que el sitio en el que estoy trabajando es [URL="http://ozzio.com.ar"]http://ozzio.com.ar[/URL] y lo que no se ven son las redes sociales


Paso a continuación el código html:

<div id="flotante">
<ul>
<li><a class="facebook" href="http://www.facebook.com/profile.php?id=100002080938644#!/profile.php?id=100002080938644" title="Seguinos en Facebook"></a></li>
<li><a class="twitter" href="http://twitter.com/OzzioDeco" title="Seguinos en Twitter"></a></li>
<li><a class="flickr" href="http://www.flick.com/photos/ozzio" title="Seguinos en Flickr"></a></li>
<li><a class="rss" href="http://ozzio.com.ar/index.php/blog.feed?type=rss" title="RSS Feed"></a></li>
<li><a class="youtube" href="http://www.youtube.com/user/OzzioDeco" title="Nuestro Canal de Youtube"></a></li>
<li><a class="newsletter" href="http://www.ozzio.com.ar/index.php/contacto.html" ></a></li>
</ul>

</div>

Código CSS

#flotante {
font-family: "arial narrow black";
font-size: 10px;
font-style: normal;
color: #000;
background-color: #280000;
text-align: center;
vertical-align: baseline;
clear: none;
float: right;
height: auto;
width: 25px;
padding-top: 5px;
padding-right: 15px;
padding-bottom: 5px;
padding-left: 10px;
overflow: visible;
position: fixed;
visibility: visible;
z-index: 1;
right: 0;
top: 110px;
margin-top: 35px;
margin-right: 0px;
margin-bottom: 35px;
margin-left: 25px;
border: 3px solid #fff;
border-right: none;
-moz-border-radius: 10px 0 0 10px;
-webkit-border-radius: 10px 0 0 10px;
border-radius: 10px 0 0 10px;
a
/* Add the drop shadow */
-moz-box-shadow: 0 0 7px rgba(0, 0, 0, .6);
-webkit-box-shadow: 0 0 7px rgba(0, 0, 0, .6);
box-shadow: 0 0 7px rgba(0, 0, 0, .6);
}

#flotante ul li {
display: block;
list-style:none;
margin-bottom:5px;
width:32px;
border: 2px outset #FFF;
}

#flotante a {
display:block;
width:32px;
background-image: url(../images/sprites.png);
margin: 0 auto;
}

.facebook {
background-repeat: no-repeat;
background-position: 0px 0px;
height: 32px;
width: 32px;
}

.facebook:hover {
background-repeat: no-repeat;
background-position: 0px -32px;
height: 32px;
width: 32px;
}

.twitter {
background-repeat: no-repeat;
background-position: 0px -64px;
height: 32px;
width: 32px;
}

.twitter:hover {
background-repeat: no-repeat;
background-position: 0px -96px;
height: 32px;
width: 32px;
}

.flickr {
background-repeat: no-repeat;
background-position: 0px -128px;
height: 32px;
width: 32px;
}

.flickr:hover {
background-repeat: no-repeat;
background-position: 0px -160px;
height: 32px;
width: 32px;
}

.rss {
background-repeat: no-repeat;
background-position: 0px -192px;
height: 32px;
width: 32px;
}

.rss:hover {
background-repeat: no-repeat;
background-position: 0px -224px;
height: 32px;
width: 32px;
}

.youtube {
background-repeat: no-repeat;
background-position: 0px -256px;
height: 32px;
width: 32px;
}

.youtube:hover {
background-repeat: no-repeat;
background-position: 0px -288px;
height: 32px;
width: 32px;
}

.newsletter {
background-repeat: no-repeat;
background-position: 0px -320px;
height: 32px;
width: 32px;
}

.newsletter:hover {
background-repeat: no-repeat;
background-position: 0px -352px;
height: 32px;
width: 32px;
}

A la espera de sus comentarios, les agradezco de antemano

Etiquetas: botones, flotante, ven, capas
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 21:04.