¿Cómo obtener la etiqueta de anclaje en la imagen de fondo de div?

HTML:

css:

 #facey { float: left; width: 32px; height: 32px; background: url(file:///C|/Users/User/Documents/TAFE%20-%20Web/ICAWEB411A%20Design%20simple%20web%20page%20layouts/testing%20color/icons/facey%20sprite.png) no-repeat 0 0; } #facey:hover { background-position: 0 -32px; } 

Tengo un sprite css para icons de redes sociales y he estado tratando de poner una etiqueta de anclaje para ir a los sitios web respectivos y no estoy seguro de cómo funciona porque las imágenes del sprite se utilizan como imágenes de fondo y la etiqueta de ancla ¿Parece que no funciona para mí dentro del div? No estoy seguro de lo que estoy haciendo mal aquí?

Añadir display:block; estilo CSS display:block; a #facey a .

Coloque el fondo en el ancla y no en la div, es la etiqueta de anclaje que se puede hacer clic al final. La div es en realidad completamente redundante aquí.

  a#facey { float: left; width:32px; height: 32px; display: block; background:url(file:///C|/Users/User/Documents/TAFE%20-%20Web/ICAWEB411A%20Design%20simple%20web%20page%20layouts/testing%20color/icons/facey%20sprite.png) no-repeat 0 0; } a#facey:hover { background-position:0 -32px; } 

No puede hacer referencia a archivos del sistema de archivos de esa manera, se considera una vulnerabilidad de seguridad en cualquier navegador que no sea IE. Trate de usar rutas relativas en su lugar:

 #facey { float: left; width:32px; height: 32px; background:url(icons/facey%20sprite.png) no-repeat 0 0; }