16/09/2012, 12:55
|
| | | Fecha de Ingreso: julio-2010
Mensajes: 158
Antigüedad: 13 años, 10 meses Puntos: 3 | |
| Sprite con comportamiento de imagen
Saludos estoy teniendo un pequeño problemita con los iconos de mi web, pues si pongo esto:
.icono { background: url(iconos.png) no-repeat; display:block;}
.1 { background-position: 0px 0px; width: 14px; height: 14px; }
.2 { background-position: -24px 0px; width: 14px; height: 14px; }
Al llamarlo
Contenido... <span class="icono 1"></span> Contenido...
El resultado es este:
Contenido...
(icono)
Contenido...
Lo cual es obvio por display:block. Pero cuando pongo float:
.icono { background: url(iconos.png) no-repeat; display:block; float:left;}
.1 { background-position: 0px 0px; width: 14px; height: 14px; }
.2 { background-position: -24px 0px; width: 14px; height: 14px; }
Al llamarlo
Contenido... <span class="icono 1"></span> Contenido... <span class="icono 1"></span>
El resultado es este:
(icono) (icono) Contenido... Contenido...
Todos los iconos se van a la derecha, lo que deceo es que se comporte como una imagen, es decir:
Contenido... (icono) Contenido... (icono)
Alguna idea de como solucionar esto? |