img content: URL no me funciona en explorer y firefox

[dmilla]

Buenos días! Tengo problema con uni img content: URL, la imagen (un megafono) se me ve correctamente en Chrome y Safari, pero no en Explorer y Firefox, agradecería que alguien me diera una solución o una técnica alternativa. Gracias. Les dejo el código.

Código CSS:

a.invento #contenido1212 .icono {
content: url(img/megafono.jpg);
float:left;
}


a:hover.invento #contenido1212 .icono {
content:url(img/megafono1.jpg);
float:left;
}


Código HTML:

<a class="invento" href="http://www.as.com">
<div id="contenido1212"><img class="icono"/>
<p class="titulo1"><b>Diseño<br/>corporativo</b></p>
<p class="titulo2">Logotipos<br/>Papelería corporativa<br/>Rótulos<br/>Merchandising</p>
</div>
</a>

[dmilla]

Les dejo la página en cuestión http://wbase.es/wbase_pruebas/diseño_graficoprueba.php

[kseso?]

Como el código css que ha publicado aquí ya nada tiene que ver con el que hay en la web que enlaza, me centro en su código html publicado:

Utiliza un doctype "XHTML 1.0 Transitional" por lo tanto no puede colocar elementos de bloque (div, p) dentro de un enlace (es de línea)
La etiqueta img está mal conformada. Obligatoriamente debe tener el atributo src="..."
La propiedad content sólo se puede declarar en los pseudoelementos ::before y ::after