tabla y hyperlink con a:hover

[samnadine]

Hola:

es mi primer post en este foro, espero que no sea el último pues me parece muy bueno.

Mi duda es la siguiente:
quiero realizar algo parecido a las tablas de productos que hay en https://tienda.yoigo.com/, con el cambio de fondo si pasas con el mouse por encima

Lo he intentado inútilmente de la siguiente manera:

Código HTML:

.box {
	background: #e6e7e7 url(img/elegir.gif) 480px 110px no-repeat ;
	margin: 10px 0 6px;
}
.box a {
	text-decoration:none;
}
.box a:hover {
	background: #738f9e url(img/elegir2.gif) 480px 110px no-repeat ;
	margin: 10px 0 6px;
}

Si le quito las etiquetas de box y las añado directamente en box a, no se ve ni el fondo. Sin embargo, parece que el a:hover no funciona, se queda igual que antes.

El HTML es simple, <div box><a><tabla><///>

¿Alguna solución?

[Eourus]

Voy a poner un ejemplo con una tabla.

Html

<table cellspacing="0" cellpadding="0">
<tr>
<td>Imagen</td>
<td>Texto</td>
</tr>
</table>

Css

tr { background:#ccc; }
tr:hover { background:red; }


Espero que esto te sirva como base para seguir investigando. ;)