Problema con un botón (en Chrome funciona y en el resto NO)

Mi problema es el siguiente:

Para la web de mi empresa (un colegio) utilicé una plantilla "free". En su hoja de estilos (CSS) pone lo siguiente:

.button a {
clear: both;
display: block;
width: 82px;
height: 22px;
padding: 4px 0 0 0;
background: url(images/templatemo_button.png) no-repeat;
color: #333;
font-weight: bold;
text-align: center;
text-decoration: none;
}

Con texto dentro funciona genial. Pero cuando le pongo una imagen y un link dentro, en Chrome me funciona perfectamente pero en el resto NO accede a la dirección del link.

En la página HTML tengo:

<button type="submit">
<a href="http://www.facebook.com" target="_blank" name="Facebook" title="Visita Facebook">
<img src="images/FBsmall.png" height="30" alt="Facebook" />
</a>
</button>

Por qué??

Podéis comprobarlo en nuestra Web www.cmidonostia.com/index.php

Gracias por adelantado.

Que?????



Y que se supone que suceda cuando hace click en el botón? Que le haga submit al form o que te redirija?

En ninguna parte del código de la página tienes un elemento con class="button" por lo tanto esa regla nunca se usa.

Además tienes un "spagetti" de tags. Pones un tag <a> dentro del un button. Eso no tiene sentido.

Ya lo siento.
Ya ves todo lo que sé de programación.
Copié y pegué sin sentido.

Ya lo he solucionado quitando lo de "<Button>" e cambiándolo por un <div class="Button"">.

Gracias por abrirme los ojos.

De nada