problema con menu css

[Jhon Silver]

Hola amigos;
Tengo un problema con el menu horizontal. Esto me ocurre con el tercer enlace, no respeta los margenes, si el 1 y el 2.
Os paso el css:

Código CSS:

ul.menu {
  background: #004848;
  list-style: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
}
ul.menu li a {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  color: #FFFFFF;
  text-decoration: none;
  font-size: 66%;
  margin: 0;
 padding: .3em;
}
ul.menu li {
  float: left;
 width: 20%;
}
 

Hago la llamada desde el archivo:

Código CSS:

<ul class="menu">
        <li><img src="IMAGENES1/home.gif" alt="Inicio" border="0"> <a href="http://www..org"> 
          Inicio</a></li>
        <li><img src="imagenesweb/herramientas.jpg"> <a href="http://www..org/herramientas-utiles.php">Herramientas</a> 
        </li>
        <li><img src="IMAGENES1/contacto.jpg" width="13" height="10"><a href="#">Tercer enlace</a></li>
      </ul>
 

El caso es que los primeros enlaces Inicio y Herramientas, si respetan las distancias. Sin embargo el enlace tercer enlace me aparece pegado al de herramientas.