ajustar el fondo a la longitud del link

Hola a todos;
En la sección de enlaces de mi web he colocado un efecto q al pasar el raton por encima del link éste aparezca con un fondo gris. Me gustaría saber si existe la posibilidad de si este fondo gris se puede ajustar a la longitud del link. Gracias.

Aquí os dejo el código CSS:
#contenido .enlaces a {font-size: 14px; color: black ; text-decoration:none ; display: block }
#contenido .enlaces a:link {}
#contenido .enlaces a:visited {}
#contenido .enlaces a:hover {font-size: 16px; color: black ; text-decoration:underline ; background-color: silver}
#contenido .enlaces a:active {}


URL de mi web: http://andoni.mywebcommunity.org/enlaces/enlaces.html

te refieres a que no abarque todo el renglon verdad??
esto es porque el enlace no tiene ancho fijo, si no que ocupa toda la linea
yo te sugiero crear un div de una anchura determinada, para que el color no sea tan extensoo bien... quitarle el display:block al grupo de las "a"

saludos

Gracias Yaneth!
Si!! me refería a que no abarcara todo el renglon.
Perdona, soy un poco novato y no te he entendido muy bien. Me dices q por un lado debo eliminar el display: block y por el otro debo crear un div con un ancho determinado. Con esto conseguiría q el fondo se ajuste al tamaño del link? o se ajustaría a la longitud q le ponga al div?
Si es posible, yo busco q se ajuste al tamaño del link

entonces.. prueba quitandole el display block en el css
y me cuentas

saludos

Se lo he quitado y aparentemente no ha ocurrido nada.

Ahora el código CSS me queda así:

#contenido .enlaces a {font-size: 14px; color: black ; text-decoration:none }
#contenido .enlaces a:link {}
#contenido .enlaces a:visited {}
#contenido .enlaces a:hover {font-size: 16px; color: black ; text-decoration:underline ; background-color: silver}
#contenido .enlaces a:active {}

Limitalo con un width.

wolfmoon escribió:Limitalo con un width.

exacto si con eso no se soluciona, ya no se con que :D

hola

hay ordenes del css que se "heredan"

aqui

a {color: white ; text-decoration:none ; display: block }
a:link {}
a:visited {}
a:hover {color: white ; text-decoration:underline ; background-color: silver}
a:active {}

#contenido .enlaces li {
list-style:circle
}
.enlaces {
line-height:20px;
margin-left:50px;
margin-top: 10px;
text-align:justify
}
#contenido .enlaces a {font-size: 14px; color: black ; text-decoration:none }
#contenido .enlaces a:link {}
#contenido .enlaces a:visited {}
#contenido .enlaces a:hover {font-size: 16px; color: black ; text-decoration:underline }
#contenido .enlaces a:active {}

si te fijas primero pusiste el display
luego abajo lo quitas
pero detodas formas lo agarra porque lo hereda
lo que debes hacer es ponerle el contrario
display:inline
y veràs el cambio

Si!! Al final era eso.
Muchas gracias, Yaneth .

viendo mi respuesta creo que no me expliquè bien
sorry si te hice batallar un poco

lo bueno es que.. quedò claro jejeje

a no sabia eso, gracias yaneth :D :D